.minify() method does not allow mix.options for CSS files

[vcarreira]

• Laravel Mix Version: 0.11.2
• Node Version: 6.9.3
• NPM Version: 3.10.10

Description:

.minify() method does not allow to pass mix.options for CSS files.

In some scenarios I just want cleanCss to inline the CSS and to not rebase URLs. Here is how we can pass additional options:

// src/File.js
minify() {
    minify() {
        if (this.fileType === '.js') {
            this.write(uglify.minify(this.file, options.uglify).code);
        }

        // From Mix options configuration
        options.cleanCss = {
            level: 0,
            rebase: false
        };

        if (this.fileType === '.css') {
            this.write(
                new UglifyCss(options.cleanCss).minify(this.read()).styles
            );
        }
    }

[rjsworking]

Hi. How does one set cleanCss options in webpack.mix.js ?

So far, with laravel-mix@0.11.4 (latest) this doesn't seem to work (comments are not removed) :

mix.options({
    purifyCss: true,
    . . . 
    cleanCss: {
        level: {
            1: {
                'specialComments': 'none'
            }
        }
    }
});

Although, running cssclean cli, cleancss -O1 specialComments:none app.css > app.opt.css works as expected and the comments are removed.

Thanks in advance

[vcarreira]

Hi, here everything is working fine.

mix.options({
    cleanCss: {
        level: {
            1: {
                specialComments: 'none'
            }
        }
    }
});

Are you running npm with production environment?
npm run production

The cleanCss options are only used on the minify method.

[rjsworking]

Hi. Yes, running npm with production environment. .
The file is minified but the comments are not removed:

@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);/*!
 * Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 *//*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */

Cheers

[ruchernchong]

@rsdev000 Yeah, I am having the same issue as you #760

[vcarreira]

I cannot reproduce the problem you are reporting.

CSS file used for testing

@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);/*!
 * Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 *//*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
.pull-right {
    float:  right;
}

/*!
    A special CSS comment
*/
.layout {
    background-color: red;
}

webpack.mix.js

mix.options({
    cleanCss: {
        level: {
            1: {
                specialComments: 'none'
            }
        }
    }
});

After running:
npm run production

The output CSS is:

@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);.pull-right{float:right}.layout{background-color:red}

Laravel-mix version: 0.11.4
Clean-css version: 4.0.10

[rjsworking]

You have the expected result.
Same laravel-mix here, cleancss 4.0.12, npm 6.5.0, node 6.10.3.
There's must be another issue