it is a tool that integrates Webpack with a Rails application
and it provides helpers to use the webpack in our Rails applications.
So webpacker simply is the Rails way of using webpack.
config/webpacker.yml — the main configuration file that contains the default configuration and configs for specific environments.
bin/webpack — executable file that invokes webpack to create bundles.
If you would like to have good understanding of rails 6 application structure check out this article.
As you see it has two directories, channels and packs.
The channels directory is generated by Action Cable.
The packs directory is the important one for us now so let's see what it has.
The application pack generated by Rails contains code related to Rails components such as turbolinks, Active Storage and Action Cable.
# config/webpacker.yml source_entry_path: packs
In development mode, we don't have to do anything.
Because when we run the
rails server command,
the compilation happens during the request.
And for live reloading webpacker generates a file
bin/webpack-dev-server so we just run the
webpack-dev-server separately for this purpose and then we can see live reloading and hot module replacement in action.
As for the production, we simply invoke the assets:precompile task as Webpacker automatically hooks up the task webpacker:compile to it.
Now one more thing,
Well For that, Webpacker provides a helper method
We use this method to include the webpacker packs in our layout files.
the method will takes care of making sure that it does reference compiled assets properly in development as well as in production.
We have just learned what is Webpacker and how it works.