GoogleChromeLabs / critters

🦔 A Webpack plugin to inline your critical CSS and lazy-load the rest.

Home Page:https://npm.im/critters-webpack-plugin

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Unknown pseudo-class selector and Critters broke hash/nonce value

blephy opened this issue · comments

Hi,

When i process webpack build with critters, i have 1 issue and 1 bug with another plugin :

Issue :

Critters do not include this pseudo-class selector

  ::-webkit-scrollbar-thumb -> unknown pseudo-class selector '::-webkit-scrollbar-thumb'

Bug :

I use CspHtmlWebpackPlugin and some nonce or hash added (like with webpack-subresource-integrity). Even if i put the right order for the plugins like above, the integrity fail and assets fails to download.

{
...
    new Critters({
      inlineFonts: true,
      preloadFonts: true,
      mergeStylesheets: true,
      keyframes: 'all',
      preload: 'swap',
      compress: true,
      logLevel: 'info'
    }),
    new CspHtmlWebpackPlugin(),
...
}

Seams like Critters is running after Webpack and doesn't use hooks inside a particular process build or something.. And Critters modifying JS / CSS content without re-running algorythm for new hash and nonce value previously injected in the html...
Am i clear ?

How can i get around this ?

Versions:
Webpack 4.29.6
Critters 2.3.0

Thanks