你可以使用一个配置文件，并使用一个环境变量有条件地包含UglifyJS插件:

const webpack = require('webpack');
const TerserPlugin = require('terser-webpack-plugin');

const PROD = JSON.parse(process.env.PROD_ENV || '0');

module.exports = {

  entry: './entry.js',
  devtool: 'source-map',
  output: {
    path: './dist',
    filename: PROD ? 'bundle.min.js' : 'bundle.js'
  },
  optimization: {
    minimize: PROD,
    minimizer: [
      new TerserPlugin({ parallel: true })
  ]
};

然后当你想缩小它时，设置这个变量:

$ PROD_ENV=1 webpack

编辑:

正如评论中提到的，通常使用NODE_ENV(按照约定)来说明特定环境是生产环境还是开发环境。要检查它，你也可以设置const PROD = (process.env。NODE_ENV === 'production')，然后正常继续。

你应该像这样导出一个数组:

const path = require('path');
const webpack = require('webpack');

const libName = 'YourLibraryName';

function getConfig(env) {
  const config = {
    mode: env,
    output: {
      path: path.resolve('dist'),
      library: libName,
      libraryTarget: 'umd',
      filename: env === 'production' ? `${libName}.min.js` : `${libName}.js`
    },
    target: 'web',
    .... your shared options ...
  };

  return config;
}

module.exports = [
  getConfig('development'),
  getConfig('production'),
];

你可以用不同的参数运行webpack两次:

$ webpack --minimize

然后检查webpack.config.js中的命令行参数:

var path = require('path'),
  webpack = require('webpack'),
  minimize = process.argv.indexOf('--minimize') !== -1,
  plugins = [];

if (minimize) {
  plugins.push(new webpack.optimize.UglifyJsPlugin());
}

...

例子webpack.config.js

要添加另一个答案，flag -p(——optimize- minimal的缩写)将启用带有默认参数的UglifyJS。

您不会在一次运行中获得一个缩小的原始包，也不会生成不同名称的包，因此-p标志可能不符合您的用例。

相反，-d选项是——debug——devtool sourcemap——output-pathinfo的缩写

我的webpack.config.js省略了devtool、debug、pathinfo和最小化插件，取而代之的是这两个标志。

你可以使用一个配置文件，并使用一个环境变量有条件地包含UglifyJS插件:

const webpack = require('webpack');
const TerserPlugin = require('terser-webpack-plugin');

const PROD = JSON.parse(process.env.PROD_ENV || '0');

module.exports = {

  entry: './entry.js',
  devtool: 'source-map',
  output: {
    path: './dist',
    filename: PROD ? 'bundle.min.js' : 'bundle.js'
  },
  optimization: {
    minimize: PROD,
    minimizer: [
      new TerserPlugin({ parallel: true })
  ]
};

然后当你想缩小它时，设置这个变量:

$ PROD_ENV=1 webpack

编辑:

正如评论中提到的，通常使用NODE_ENV(按照约定)来说明特定环境是生产环境还是开发环境。要检查它，你也可以设置const PROD = (process.env。NODE_ENV === 'production')，然后正常继续。

我找到了解决这个问题的新方法。

这使用了一个配置数组，使webpack能够并行地构建精简版和非精简版。这使得构建更快。不需要运行webpack两次。不需要额外的插件。只是webpack。

webpack.config.js

const devConfig = {
  mode: 'development',
  entry: { bundle: './src/entry.js' },
  output: { filename: '[name].js' },
  module: { ... },
  resolve: { ... },
  plugins: { ... }
};

const prodConfig = {
  ...devConfig,
  mode: 'production',
  output: { filename: '[name].min.js' }
};

module.exports = (env) => {
  switch (env) {
    case 'production':
      return [devConfig, prodConfig];
    default:
      return devConfig;
  }
};

运行webpack将只生成非缩小版本。

运行webpack——env=production将同时构建缩小版和非缩小版。