Laravel-mix: PurifyCss in Production results in broken Css

Created on 3 Apr 2018 · 4Comments · Source: JeffreyWay/laravel-mix

Npm: 5.8.0
Node: 8.4.0
Laravel Mix: 1.7.2 and 2.1.0 Tested

Using purifyCss with npm run prod results in not working Css, as a lot styles are missing, even though listed under whitelist: [] and used in blade files.

webpack.mix.js:

mix.js('resources/assets/js/app.js', 'public/js')
    .js('resources/assets/js/admin.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .sass('resources/assets/sass/admin.scss', 'public/css')
    .copy('node_modules/cropperjs/dist/cropper.min.css', 'public/css')
    .options({
        purifyCss: {
            purifyOptions: {
                purifyCss: true,
                whitelist: ['collapsing', 'callapse', 'show', 'collapsed', 'fa', '*fa*', 'blockquote']
            },
        }
    });

Repository: https://github.com/3Descape/EV.git You should rename .env.example to .env and have a DB called ev.

Source

3Descape

👍1

Most helpful comment

You might want to use
https://github.com/spatie/laravel-mix-purgecss

ankurk91 on 7 Apr 2018

❤3

All 4 comments

You might want to use
https://github.com/spatie/laravel-mix-purgecss

ankurk91 on 7 Apr 2018

❤3

works like a charm! thank you very much

3Descape on 7 Apr 2018

👍1

I am with the same problem. This wasn't fix yet?

rivajunior on 7 Jun 2018

Yeah, if somebody is interested in this:

I've faced the same issue and was able to fix it, please fill free to use it as
npm install git://github.com/alex7r/purifycss.git#master
while it's waiting to be accepted.

After digging deep I've found that the cause was not the code in this repo, but the code in the dependency of the 2nd level:
purifycss => rework => css
So please look at the PR to find out more info
https://github.com/reworkcss/css/pull/118