为什么css没有压缩成功

大佬们,为什么我这样写没有看到压缩好的css文件呢?html和js文件都成功的压缩了,存进了dist文件夹

var path = require('path');
var htmlwebpackplugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var webpack = require('webpack');

var ROOT_PATH = path.resolve(__dirname);
var BUILD_PATH = path.resolve(ROOT_PATH,'dist');

module.exports = {
    entry: './js/main.js',
    output: {
        filename: 'bundle.js',
        path: BUILD_PATH
    },
    module: {
        rules: [
            {
                test: /(\.jsx|\.js)$/,
                use: {
                    loader: "babel-loader"
                },
                exclude: /node_modules/
            }, 
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: [
                        {
                            loader: "css-loader",
                            options: {
                                modules: true,
                                minimize: true
                            }
                        }
                    ],
                })
            },
            {
                test: /\.less$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: [
                        {
                            loader: "less-loader",
                            options: {
                                modules: true,
                                minimize: true
                            }
                        }
                    ],
                })
            },
        ]
    },
    plugins: [
        new htmlwebpackplugin({
            template: './index.html',
            hash: true,
            minify: { //压缩HTML文件
                removeComments: true, //移除HTML中的注释
                collapseWhitespace: true //删除空白符与换行符
            }
        }),
        new webpack.optimize.UglifyJsPlugin({  //压缩js
           compress: {
               warnings: false
           },
           except: ['$super','$','exports','require'] //排除关键字
        }),
        new ExtractTextPlugin('./css/css.css')
    ]
};

clipboard.png

clipboard.png

阅读 3.5k
3 个回答

试试把webpack的devtool设置为false

修改你的less配置

 {
                test: /\.less$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: ['css-loader', 'less-loader']
                })
            },
new ExtractTextPlugin({
        //生成css文件名
        filename: 'static/css/[name].css',
        disable: false,
        allChunks: true
    }),
新手上路,请多包涵

请问你解决了吗

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