Как добавить минификацию в webpack?

Question

[fillpower]

Добрый день, есть такая сборка, у меня не выходит добавить uglify JS в production сборку, подскажите как сделать это правильно?

const path = require('path')

const postcssNested = require('postcss-nested')
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
const CopyPlugin = require('copy-webpack-plugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

const output = path.resolve(__dirname, 'target')

module.exports = {
    entry: {
        index: require.resolve('./src/index.js')
    },
    output: {
        path: output,
        filename: 'index.js'
    },
    module: {
        rules: [
            // js-файлы
            {
                test: /\.js$/,
                exclude: /node_modules[\\/].*/,
                use: require.resolve('babel-loader')
            },
            // css-файлы
            {
                test: /\.css$/,
                use: [
                    require.resolve('style-loader'),
                    {
                        loader: require.resolve('css-loader'),
                        options: {
                            modules: true,
                            importLoaders: 1
                        }
                    },
                    {
                        loader: require.resolve('postcss-loader'),
                        options: {
                            plugins: [
                                postcssNested
                            ]
                        }
                    }
                ]
            }
        ]
    },
    plugins: [
        new CopyPlugin([
            {
                from: 'static',
                to: '.'
            }
        ])
    ]
}

if (process.env.NODE_ENV === 'production') {
    module.exports.plugins.push(
        new BundleAnalyzerPlugin({
            reportFilename: './statistics.html',
            analyzerMode: 'static',
            openAnalyzer: false
        })
    )
}

Answer 1

[Сергей Соколов]

потеряли:

optimization: {
    minimizer: [
      new UglifyJsPlugin({
        sourceMap: true
      })
    ]
  },

См. документацию по плагину UglifyJsPlugin

Comments

[fillpower]

Я это вставлял, у меня не работало, вопрос как раз-таки и был, куда вставить настойки этого плагина?

[Сергей Соколов]

fillpower, внутрь

module.exports = {
  optimization: ...
}

Answer 2

[Петр Мухуров]

const config = {
 ...
 optimization: {}
};

if (process.env.NODE_ENV === "production") {
  config.optimization.minimizer = [
    new UglifyJsPlugin({
      sourceMap: true,
      parallel: true,
      uglifyOptions: {
        compress: {
          drop_console: true
        }
      }
    })
  ];
}

module.exports = config;

Comments

[fillpower]

Не работает, либо я не правильно вставляю...

[Петр Мухуров]

fillpower, скорее второе