在webpack配置中,用ExtractTextPlugin分离less,打包成css文件,然后css文件怎么进行压缩呢?

const webpack = require('webpack');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
//const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin'); 

module.exports = {
    entry : {
        resetentry: __dirname + '/src/js/reset_entry.js',
    }, 
    output : {
        path: __dirname + '/out',
        filename: '[name].js',
    }, 
    module: {
        rules:[
                {
                    test: /.less$/, 
                    use: ExtractTextPlugin.extract({
                        use:[
                            {loader:'css-loader'},
                            {loader:'less-loader'}
                        ],
                        fallback: 'style-loader',
                    })
                },
                {
                    test: /\.js$/,
                    loader: "babel-loader",
                    exclude:/node_modules/,
                    query:{
                        presets:[
                            require.resolve('babel-preset-es2015'),
                            require.resolve('babel-preset-stage-0'),
                        ]
                    }
                },
                {test: /.jpg|png|gif|svg$/, use: ['url-loader?limit=8192&name=./[name].[ext]']}, 
            ]         
    },
    plugins:[
        new UglifyJSPlugin(),
        new ExtractTextPlugin("[name].css"), 
        new webpack.ProvidePlugin({
            $: 'jquery', 
            jQuery: 'jquery', 
            'window.jQuery': 'jquery'
        }),
//      new OptimizeCssAssetsPlugin({
//        assetNameRegExp: /\.less$/g,
//        cssProcessor: require('cssnano'),
//        cssProcessorOptions: { discardComments: {removeAll: true}},
//        canPrint: true,
//      }),
    ]
}

我用optimize-css-assets-webpack-plugin这个插件,不知道哪里的原因。

阅读 3.2k
1 个回答

执行npm run build不就打包了吗?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进