Need to disable minify of CSS but not JS using UglifyJsPlugin webpack

Question

I have this setup in my webpack.config for loading my css files. I need to disable minify on my css files only.

{
   test: /\.sass$/,
   //loaders: ['style', 'css', 'sass']
   loader: ExtractTextPlugin.extract('style', 'css-loader!less-loader')
}

in my plugins i have:

new webpack.optimize.UglifyJsPlugin({
   exclude: [/file\.css$/],
   minimize: true
})

Based on what I have been reading mixing UglifyJsPlugin and css-loader together is what causes the minifying of CSS. The problem is there are multiple bugs where it outputs invalid CSS.

it is still minifying my css despite these various attempts to disable for css.

How can disable minify for css but still minify my js files?

mixing UglifyJsPlugin and css-loader together causes webpack to minify CSS. There must be an option to disable CSS minify, but havnt found it yet — appthat
– appthat, Commented Sep 6, 2016 at 23:34

appthat · Accepted Answer · 2016-09-08 16:10:28Z

4

so I have figured out what needs to be done.

when it comes to invalid CSS output, you need to add the

?-minimize    
loader: ExtractTextPlugin.extract('style', 'css-loader?-minimize!less-loader')

This attribute -minimize in the docs says it will disable minification (which it doesnt), but it did fix the invalid CSS issues I was getting.

answered Sep 8, 2016 at 16:10

appthat

8262 gold badges12 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

vudduu Over a year ago

It will also work including the css in the bundle.js. { test: /\.css$/, loader: 'style-loader!css-loader?-minimize&-autoprefixer!postcss-loader', }

Collectives™ on Stack Overflow

Need to disable minify of CSS but not JS using UglifyJsPlugin webpack

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related