webpack is missing?

[scottwater]

I am trying to use purgecss in my production environment (Heroku and Ruby 2.6 if that matters).

On deploy, I am seeing the following output:

" > purgecss-webpack-plugin@1.4.0" has unmet peer dependency "webpack@^4 || ^3"

The deployment succeeds, but it does not look like the purgecss plugin is getting properly executed.

I am using the 3.5.5 version of the web packer gem.

If I read this error message correct, it sounds like it is not finding webpack.

Below are my package.json, environment.js, and production.js.

I am not sure if this is a bug or simply my lack of understanding.

Thanks,
Scott

My package.json

{
  "name": "indie_triage",
  "private": true,
  "dependencies": {
    "@rails/webpacker": "3.5",
    "caniuse-lite": "^1.0.30000697",
    "glob-all": "^3.1.0",
    "jstz": "^2.1.1",
    "purgecss-webpack-plugin": "^1.4.0",
    "tailwindcss": "^0.7.2"
  },
  "devDependencies": {
    "webpack-dev-server": "2.11.2"
  }
}

environment.js

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

process.env.NODE_ENV = process.env.NODE_ENV || 'production'

const environment = require('./environment')

const path = require('path')
const PurgecssPlugin = require('purgecss-webpack-plugin')
const glob = require('glob-all')


// ensure classes with special chars like -mt-1 and md:w-1/3 are included
class TailwindExtractor {
  static extract(content) {
    return content.match(/[A-z0-9-:\/]+/g);
  }
}

environment.plugins.append('PurgecssPlugin', new PurgecssPlugin({
  paths: glob.sync([
    path.join(__dirname, '../../app/javascript/**/*.js'),
    path.join(__dirname, '../../app/views/**/*.erb')
  ]),
  extractors: [ // if using Tailwind
    {
      extractor: TailwindExtractor,
      extensions: ['html', 'js', 'erb']
    }
  ]
}));

module.exports = environment.toWebpackConfig()

[gauravtiwari]

@scottwater Hey, that warning is harmless. It seems like it should be working unless you are getting some runtime or compile time errors.

Perhaps, you can include some unused css and see if it's getting purged after compilation, locally.

[scottwater]

@gauravtiwari If I put add the same code in production.js to development.js, I can see it is getting is working properly locally. It is only in production.js it seems to be failing. Let me see if I can create a better demo to test this out.

[gauravtiwari]

Perhaps, trying compiling locally in production mode, that should output any errors.

bundle exec rails webpacker:compile

[scottwater]

Hi @gauravtiwari,

First, thanks again for your help, especially on the weekend, I really appreciate it.

I believe I now know what is going on:

1. I enabled Purgecss on an existing CSS file that had already been cached on my CDN.
2. It looks like the MD5 hash added to the file name is based on the content at deploy time.
3. Purgecss and likely any other related plugin will modify the file after the MD5 hash was assigned.
4. Because the MD5 hash did not change (and I did not disable the cache in dev tools), I was not seeing the updated file in production...but because there is no CDN locally, I did see Purgecss/Webpacker working properly.

I am not sure if there is a fix for this short of flushing the CDN cache, which is far from reliable.

If there is anything that can be done in webpacker to set the hash to be what is in the final file I am certainly interested...otherwise, please consider this issue closed.

[jakeNiemiec]

purgecss-webpack-plugin@1.4.0" has unmet peer dependency "webpack@^4 || ^3

purgecss-webpack-plugin sees that you are missing webpack in the dependencies section of your package.json. Harmless in this context because @rails/webpacker implicitly includes webpack.

I am using the 3.5.5 version of the web packer gem.

It looks like the MD5 hash added to the file name is based on the content at deploy time.

You might try version 4+, I think there were improvements with chunking/hashing that were not backported to 3.

[scottwater]

Hi @jakeNiemiec

Thanks.

You might try version 4+, I think there were improvements with chunking/hashing that were not backported to 3.

That's what I was thinking as well. Trying to walk through the upgrade here. #1923

[joevandyk]

@scottwater can this be closed?