Introduction to Webpacker

As Rails 6 developers, our primary interaction with webpack is going to be through the Webpacker tool provided by Rails. In this chapter, we’ll take a look at using Webpacker in development and how to customize it when we want additional features.

The Webpacker gem is a default part of a new Rails 6 installation, which means Webpacker goes in the Gemfile and, by default, the webpack:install task is run when the app is created. We can skip Webpacker entirely with rails new . --skip-webpack-install, or we can install one of the existing frameworks with something like rails new . --webpack=stimulus.

After the app is created, you can add Webpacker to an existing app with the rake task rails webpacker:install, which has options like rails webpacker:install:stimulus for each framework or add-on Webpacker supports.

Webpacker basics

Webpacker is a wrapper around webpack designed to make webpack easier to manage within a Rails application.

The main thing Webpacker does is generate a webpack configuration using a set of inputs that is hopefully simpler to deal with than a full webpack configuration. It uses a YAML file, config/webpacker.yml, to specify several webpack values, and specific environment overrides are in the config/webpack directory.