optimize-css-assets-webpack-plug
2020-10-18 本文已影响0人
风向应该可以决定发型吧
optimize-css-assets-webpack-plugin文档
安装
npm i -D optimize-css-assets-webpack-plugin
// webpack 3及以下
npm i -D optimize-css-assets-webpack-plugin@3.2.0
| 参数 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| assetNameRegExp(可选) | RegExp | /.css$/g | 此插件压缩的对象是由mini-css-extract-plugin插件输出的css文件,而不是css源文件 |
| cssProcessor(可选) | Function | cssnano | 压缩css的处理器,一个函数,接收CSS模块和options参数并返回一个promise对象
|
| cssProcessorOptions(可选) | Object | {} | 传递给cssProcessor的配置对象 |
| cssProcessorPluginOptions(可选) | Object | {} | 传递给cssProcessor的插件配置对象 |
| canPrint(可选) | Boolean | true | 配置插件是否可以将消息打印到控制台 |
var OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
module: {
rules: [
{
test: /\.css$/,
loader: MiniCssExtractPlugin.extract('style-loader', 'css-loader')
loader: MiniCssExtractPlugin.loader,
options: {publicPath: '/public/path/to/' }
}
]
},
plugins: [
new ExtractTextPlugin('styles.css'),
//new OptimizeCssAssetsPlugin()
new OptimizeCSSAssetsPlugin({
assetNameRegExp: /\.css$/g,
cssProcessor: require('cssnano'),
cssProcessorPluginOptions: {
preset: ['default', { discardComments: { removeAll: true } }],
},
canPrint: true
}),
]
};
