Rails 4: getting Webpacker to work with CircleCI

Solved by adding the following to .circleci/config.yml:

Docker image:

image: circleci/ruby:<<ruby_version>>-node-browsers

(this is necessary so that we have a Docker image with Node.js preinstalled)

Environment variables:

NODE_ENV: test

This is necessary so that the webpacker:compile step runs under the test env.

And the following step:

yarn_install:
  steps:
    - restore_cache:
        keys:
          - yarn-cache-v1-{{ checksum "yarn.lock" }}
          - yarn-cache-v1-
    - run: yarn install --cache-folder ~/.cache/yarn
    - run: bundle exec rake webpacker:compile
    - save_cache:
        key: yarn-cache-v1-{{ checksum "yarn.lock" }}
        paths:
          - ~/.cache/yarn

This seems to have done the trick!


I ran into this problem recently and tried the accepted solution but it didn't work for me. I got the same error as the OP when I ran my specs on CircleCI.

My solution was to include yarn install and rails webpacker:compile in my existing bundle step as follows:

      - run: yarn install
      - run: bin/rails webpacker:compile

I then added public/packs-test to the folders in the cache:

      - save_cache:
          key: v1-bundle-{{ checksum "Gemfile.lock" }}-{{ checksum "yarn.lock" }}
          paths:
            - vendor/bundle
            - public/packs-test

As you can see I added the checksum of the yarn.lock file to the cache key to make sure that the cache was regenerated if anything changed in the packs.