Questions tagged [cssnano]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
0 votes
0 answers
79 views

Can't configure CssMinimizerPlugin.cssnanoMinify to works in production mode

By default, css-minimizer-webpack-plugin plugin uses cssnano package. I wouldn't like to use another options (not cssoMinify, cleanCssMinify, etc). normalizeWhitespace: true/false and any options work ...
2 votes
1 answer
582 views

Angular 11/CSS minification: How to prevent conversion of rgba to 8 digit hex code during css minification to support older chrome

We've a web app that's developed in Angular 11(cli V11.2.14) & Asp.net core and running fine, now needs to be supported in chrome older version(browser version 60). I came across css issues mainly ...
  • 109
3 votes
3 answers
1k views

Angular ionic build: Cannot read property 'toLowerCase' of undefined postcss

I'm trying to build my application, but I'm getting this error from Postcss. Note: the file on '/srv/http/r2-app/styles.e4dd05dfea4b7f17f938.css' does not exist. [error] TypeError: Cannot read ...
1 vote
0 answers
208 views

GRUNT: grunt-postcss not executing cssnano when used together with sass - if scss file long

I am using both the sass parser and gruntpostcss with cssnano on watch. cssnano` is parsing the file just fine if its a short file, but it my scss/css file gets long css file, the it is not parsing ...
  • 225
0 votes
1 answer
99 views

Stop cssnano v4 from adding quotes to named grid-areas

cssnano v4 turns named grid-areas into quoted strings instead of custom-identifiers, eg: /* input */ header { grid-area: header; } /* output */ header { grid-area: "a"; } Making ...
  • 2,779
0 votes
4 answers
3k views

CSS minification error in npm run build [vue.js]

Im receiving this error everytime I try to run 'npm run build' and I dont have any css file. ERROR Error: CSS minification error: Unexpected ":" found.. File: css/app.86f0ef2e.css Error: ...
1 vote
1 answer
1k views

Optimizing CSS with cssnano advanced transforms using Gulp + PostCSS

My current working gulpfile.js: var postcss = require('gulp-postcss'); var gulp = require('gulp'); var cssnano = require('cssnano'); gulp.task('css', function () { var ...
  • 1,269
0 votes
1 answer
701 views

webpack/cssnano not compressing all CSS files?

I'm using webpack 4 postcss-loader cssnano mini-css-extract-plugin The postcss/cssnano config looks like: { loader: 'postcss-loader', options: { sourceMap: true, ...
  • 268k
1 vote
3 answers
8k views

How to configure cssnano for CSS minification?

I am trying to configure cssnano plugin for the postcss-loader, which minifies CSS, very similar, as described here. Webpack config: ... module: { rules: [ { test: /\.css$/, ...
  • 1,251
3 votes
0 answers
1k views

Autoprefixer not using "grid: autoplace" with cssnano and postcss

We are using postcss with cssnano and autoprefixer. My problem is that postcss does not use the "grid: autoplace" in my postcss.config.js. This is my postcss.config.js: const cssnano = require('...
  • 644
2 votes
1 answer
4k views

Cssnano doesn't remove duplicates

I have a React web application where i use CSS modules. I am using Webpack to build the application. Related part from the webpack.config.js : { test: /\.css$/, use: extractCSS.extract( ...
1 vote
1 answer
591 views

Cannot turn off colormin optimization from the cssnano configuration

I have the Webpack setup in which I use optimize-css-assets-webpack-plugin with cssnano as the CSS processor. In there, I don't want to use the colormin optimization. Optimizations: https://...
12 votes
1 answer
9k views

Postcss-loader not minifying css output

I'm using webpack and postcss-loader to autoprefix and minify my CSS, before loading it into css-loader to use css-modules. I'm having trouble with minifying CSS. Examining the emitted .js file by ...
  • 1,257
2 votes
1 answer
2k views

How do I add cssnano optimization rules in vue-cli 3?

I am trying to add cssnano optimization rules but with vue-cli, it doesn't seem to work. I added the following script in vue.config.js: module.exports = { css: { loaderOptions: { postcss: ...
  • 21
2 votes
1 answer
1k views

Css minification not working (gulp + cssnano)

I have a very basic gulpfile set up like this: 'use strict'; var gulp = require('gulp'); var sass = require('gulp-sass'); var notify = require('gulp-notify'); var browserSync = require('browser-sync'...
2 votes
1 answer
3k views

Minify multiple input file with postcss

I installed cssnano following these step: http://cssnano.co/guides/getting-started/ Into the root of my project i ran: npm install cssnano --save-dev After i installed postcss-cli: npm install ...
  • 466
0 votes
1 answer
2k views

Does cssnano apply css autoprefixer?

I want to apply cssnano and autoprefixer on my css code. I read on the internet that it is enough to use cssnano, that cssnano automatically applies autoprefixer. When I use this code: var gulp = ...
user avatar
2 votes
1 answer
669 views

gulp-postcss: conditional options (optimizations)

I learned the list of cssnano optimizations: it includes autoprefixer (not default), cssnano-util-raw-cache, etc. Next I look the gulp-postcss documentation: it has the following example: var ...
0 votes
1 answer
994 views

Webpack: How to merge css and less, THEN apply cssnano

I managed to compile my css and less resources („imported“ from javascript) to all-my-LESS|CSS, extract them using ExtractTextPlugin and merge them together with MergeFilesPlugin to combinedStyles.css....
  • 9,395
0 votes
1 answer
192 views

cssnano removes "all" attribute from css @media query

I am curious if what cssnano does to media queries is ok. In my css file, I have. @media all and ( min-width: 600px) {} After running my css through cssnano, it turns it to this > @media ( min-...
  • 101
2 votes
0 answers
1k views

Retaining empty/unused classes with CSS Loader

I am building a React application through Webpack 2, generating CSS through SASS-loader and CSS-loader. Here is my Webpack 2 configuration: loaders: [ { test: /\.(css|scss)$/, ...
  • 7,987
2 votes
0 answers
341 views

gulp postcss cssnano does not combine the same selector when it is not next to it

Gulp in postcss with cssnano combine the same selector when the selector next to it but unfortunately it does not combine the selector when it is not next to it. It works very well when selectors ...
  • 25.8k
2 votes
1 answer
229 views

cssnano is reordering overridden properties

I am using less, postcss and cssnano (version 3.7.3). In less, I am using classes which inherit from a shared base and overriding some of the properties when needed. I am finding that cssnano is ...
  • 1,829