1. @intervolga/optimize-cssnano-plugin
WebPack 2+ plugin for CSS minification after ExtractTextPluging
@intervolga/optimize-cssnano-plugin
Package: @intervolga/optimize-cssnano-plugin
Created by: intervolga
Last modified: Tue, 05 Apr 2022 20:45:51 GMT
Version: 1.0.6
License: MIT
Downloads: 1,381,480
Repository: https://github.com/intervolga/optimize-cssnano-plugin

Install

npm install @intervolga/optimize-cssnano-plugin
yarn add @intervolga/optimize-cssnano-plugin

optimize-cssnano-plugin Build Status

It will search for CSS assets during the Webpack build and minimize it with cssnano.
Solves extract-text-webpack-plugin CSS duplication problem.

Just like optimize-css-assets-webpack-plugin but more accurate with source maps.

Installation:

Using npm:

 $ npm install --save-dev @intervolga/optimize-cssnano-plugin

Configuration:

 const OptimizeCssnanoPlugin = require('@intervolga/optimize-cssnano-plugin');
module.exports = {
	module: {
		loaders: [
			{ test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }
		]
	},
	plugins: [
    new ExtractTextPlugin("styles.css"),

    new OptimizeCssnanoPlugin({
      sourceMap: nextSourceMap,
      cssnanoOptions: {
        preset: ['default', {
          discardComments: {
            removeAll: true,
          },
        }],
      },
    }),
	]
}

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin