webpack.config.js====CSS相關：插件optimize-css-assets-webpack-plugin

更多內容已經遷移至掘金，歡迎來指導學習：

https://juejin.im/post/5d64cceaf265da03aa257d06

 

 

1. 安裝：主要是用來壓縮css文件

cnpm install --save-dev optimize-css-assets-webpack-plugin cssnano

2. webpack.config.js配置

const optimizeCssAssetsWebpackPlugin=require('optimize-css-assets-webpack-plugin');

  //壓縮css插件配置
        new optimizeCssAssetsWebpackPlugin() //暫時不起作用，后期研究 // new optimizeCssAssetsWebpackPlugin({ // assetNameRegExp: /css\[name].[hash].css$/g, // cssProcessor: require('cssnano'), // cssProcessorPluginOptions: { // preset: ['default', { discardComments: { removeAll: true } }], // }, // canPrint: true //是否將消息打印到控制台 // })

3. 備注

assetNameRegExp：一個正則表達式，指示應優化\最小化的資產的名稱。提供的正則表達式針對配置中ExtractTextPlugin實例導出的文件的文件名運行，而不是源CSS文件的文件名。默認為/\.css$/g
cssProcessor：用於優化\最小化CSS的CSS處理器，默認為cssnano。這應該是一個跟隨cssnano.process接口的函數（接收CSS和選項參數並返回一個Promise）。
cssProcessorOptions：傳遞給cssProcessor的選項，默認為 {}
cssProcessorPluginOptions：傳遞給cssProcessor的插件選項，默認為 {}
canPrint：一個布爾值，指示插件是否可以將消息打印到控制台，默認為 true

webpack4.X版本中，webpack -p命令，是可以默認壓縮js文件的