Upgrading webpacker from 4.2.2 to 5.0.1 is no longer running yarn install before assets:precompile

Viewed 1908

After following each step in the webpacker upgrading section, an upgrade from 4.2.2 to 5.0.1, is causing yarn install to no longer be invoked during rails assets:precompile. This is causing front-end packages sourced from our package.json file to not be found during the asset compilation process.

This is highlighted when CI runs rails assets:precompile. Previously assets:precompile would run yarn install before compiling our application.js file. I've added the --trace flag and it runs as if it skips yarn install.

** Invoke yarn:install (first_time)
** Execute yarn:install
** Execute assets:precompile
rails aborted!
Sprockets::FileNotFound: couldn't find file 'moment' with type 'application/javascript'

The same CI run with the older webpack version displays the yarn install output as expected. Has anyone run into this same issue when bumping to 5.x?

2 Answers

We are currently on Rails 5.2.4 which didn't have the yarn binstub. Webpacker 5.0.1's yarn install task calls the binstub which internally invokes yarnpkg. Without the presence of the binstub, the rake task would do nothing which is what we were experiencing. Adding the missing binstub solved our issues.

/bin/yarn

#!/usr/bin/env ruby
APP_ROOT = File.expand_path('..', __dir__)
Dir.chdir(APP_ROOT) do
  begin
    exec "yarnpkg", *ARGV
  rescue Errno::ENOENT
    $stderr.puts "Yarn executable was not detected in the system."
    $stderr.puts "Download Yarn at https://yarnpkg.com/en/docs/install"
    exit 1
  end
end

Comment/remote the sprockets line from config/application.rb:

# config/application.rb

# Remove the line below
 require "sprockets/railtie"

You can also remove config.assets ... lines from all your config/environment/*.rb files:

# config/environment/*.rb

# Remove the following lines
  config.assets.debug = true
  config.assets.quiet = true

These are no longer required with Webpacker and could also cause errors.

Hope that helps :)

Related