Laravel-mix-criticalcss in Docker cannot read property 'content-type'

Question

I'm trying to set up laravel-mix-criticalcss in a Docker container and I'm getting an error. Has anyone come across this before?

Error

[webpack-cli] TypeError: Cannot read property 'content-type' of undefined at temp (/var/www/html/node_modules/critical/lib/file-helper.js:112:37) at /var/www/html/node_modules/critical/lib/file-helper.js:214:27 at runMicrotasks () at processTicksAndRejections (internal/process/task_queues.js:97:5) error Command failed with exit code 2.

webpack.mix.js

let mix = require('laravel-mix');
require('laravel-mix-criticalcss');

mix.sass('resources/assets/sass/style.bundle.scss', 'public/build/css')
    .criticalCss({
    enabled: mix.inProduction(),
    paths: {
        base: 'http://localhost',
        templates: './',
        suffix: '_critical.min'
    },
    urls: [
        { url: '', template: '/' },
    ],
    options: {
        minify: true,
    },
});

Answer 1

I had a very similar issue:

[webpack-cli] TypeError: Cannot read property 'content-type' of undefined
    at temp (/var/www/skin.test/node_modules/html-critical-webpack-plugin/node_modules/critical/lib/file-helper.js:107:37)
    at /var/www/skin.test/node_modules/html-critical-webpack-plugin/node_modules/critical/lib/file-helper.js:205:27

and what I found:

https://github.com/addyosmani/critical/issues/414

https://github.com/michtio/laravel-mix-criticalcss/issues/11

so, the problem was html-critical-webpack-plugin that used old critical version

I reinstalled laravel-mix-criticalcss from @ampedweb fork: https://github.com/ampedweb/laravel-mix-criticalcss

Then I passed production url to plugin's settings pathes.base to check if critical css worked.

I got new error - Error: Failed to launch the browser process!

I found a troubleshooting url here: https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md.

Then I installed all recommended libraries from URL above to node container, and now critical CSS works at least for production.

Now I try to figure out with local critical CSS in Docker (I have local error RequestError: connect ECONNREFUSED 127.0.0.1:8000).