Webpacker asset digest not consistent from deploy to deploy

Question

I'm using Rails with Webpacker. When I deploy, my CSS asset digest (the digest on the files in public/packs/css) is not the same from deploy to deploy.

Not only is the digest not the same from deploy to deploy, but sometimes (although not always) the digest is different from machine to machine.

How can I troubleshoot this issue? I thought I could maybe gain some insight by learning exactly how the digest is generated, but I haven't been able to find any good information on that so far.

Answer 1

Found the solution, thanks to these two GitHub issues.

Step 1: run yarn add webpack-merge.

Step 2: change config/webpack/environment.js to match the following:

const { environment } = require('@rails/webpacker')

const { merge } = require('webpack-merge');

const sassLoader = environment.loaders.get('sass')
const cssLoader = environment.loaders.get('css')

sassLoader.use.map(loader => {
  if (loader.loader === 'css-loader') {
    loader.options = merge(loader.options, { sourceMap: false })
  }
});

cssLoader.use.map(loader => {
  if (loader.loader === 'css-loader') {
    loader.options = merge(loader.options, { sourceMap: false })
  }
});

module.exports = environment

Afterward, the CSS digests should be deterministic.