Installing Webpacker

Learn to install Webpacker in this lesson.

A typical Rails 6 app will install Webpacker as part of the default app creation. These installation steps have already been done for the application in the sample code, we’re walking through these steps so you can see what files and changes are part of a Webpacker installation.

To install Webpacker, we first need to add the gem to the bundle file, so ensure that your Gemfile contains the line.

Press + to interact
gem "webpacker"

Then, bundle install from the command line. Now we are able to install Webpacker; as we write this, the current version is 5.1.1. At the moment, we won’t add any frameworks, but we will add TypeScript support.

From the command line, run:

Press + to interact
bundle exec rails webpacker:install

This install command creates a number of local files and retrieves a bunch of JavaScript libraries using the Yarn package manager.

We also need to run:

Press + to interact
$ bundle exec rails webpacker:install:typescript

This will add one or two new files but will mostly modify files created by the first installation.

Webpacker has now created about a dozen files, plus we’ve added a new directory, node_modules, that contains thousands of JavaScript modules. Right now, we’re going to try and understand what some of these new files do for us. In the course, we went in depth on what Webpacker install does in the Webpacker chapter. The first batch of files we are going to look at are the ones that manage JavaScript packages.

Package managers and modules

Many programming languages have ways for useful libraries of code to be shared, along ...