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
| 參數(shù) | 類型 | 默認(rèn)值 | 描述 |
|---|---|---|---|
| assetNameRegExp(可選) | RegExp | /.css$/g | 此插件壓縮的對(duì)象是由mini-css-extract-plugin插件輸出的css文件,而不是css源文件 |
| cssProcessor(可選) | Function | cssnano | 壓縮css的處理器,一個(gè)函數(shù),接收CSS模塊和options參數(shù)并返回一個(gè)promise對(duì)象
|
| cssProcessorOptions(可選) | Object | {} | 傳遞給cssProcessor的配置對(duì)象 |
| cssProcessorPluginOptions(可選) | Object | {} | 傳遞給cssProcessor的插件配置對(duì)象 |
| canPrint(可選) | Boolean | true | 配置插件是否可以將消息打印到控制臺(tái) |
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
}),
]
};
