在 webpack 构建中仅缩小 JS 文件

Question

我正在使用 webpack 进行生产构建，如下所示：

module.exports = {
    devtool: 'source-map',
    entry: [
        'babel-polyfill',
        './src/index'
    ],
    output: {
        filename: 'bundle.js',
        path: path.join(__dirname, 'dist')
    },
    plugins: [
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.optimize.DedupePlugin(),
        new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en|he/),
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify('production')
        }),
        new ExtractTextPlugin('style.css'),
        new webpack.optimize.UglifyJsPlugin({
            compressor: {
                warnings: false
            }
        })
    ],
    module: {
        loaders: [
            {
                test: /\.js$/,
                loaders: ['babel'],
                include: path.join(__dirname, 'src'),
                exclude: path.join(__dirname, 'src', 'test')
            },
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract('css?-minimize!sass!postcss-loader'),
                include: path.join(__dirname, 'src', 'styles')
            },
            {
                test: /\.(jpe?g|png|gif)$/i,
                loader: 'url?limit=8192',
                include: path.join(__dirname, 'assets')
            },
            {
                test: /\.svg$/,
                loader: 'babel!svg-react',
                include: path.join(__dirname, 'assets')
            }
        ]
    },
    postcss: [autoprefixer({ browsers: ['last 2 versions'] })]
};

如您所见，代码被UglifyJsPlugin 缩小。问题是它还缩小了 CSS 文件（由ExtractTextPlugin 提取）。我想避免 CSS 缩小以便在构建后处理它。

如何告诉插件只缩小我的 JS 文件？

谢谢，
托默

Answer 1

见：Webpack Uglify errors in CSS 您可以添加test 来通过正则表达式丑化和过滤文件...

new webpack.optimize.UglifyJsPlugin({
  test: /\.(js|jsx)$/
})

或者……

您不必在一个webpack.config.js 中完成所有操作。

由于您要将 css 构建到单独的文件中，因此有两个 webpack.config，一个用于 js，另一个用于 css。不要忘记构建两者。