用于Webpack Stream（Gulp + Webpack）的Uglify JS Webpack插件

Question

我正在尝试使用Gulp + Webpack workflow

大多数事物都在https://github.com/IamManchanda/gulp-webpack/工作

但是，当我尝试根据提到的文档实施UglifyjsWebpackPlugin时，它似乎不起作用。我没有任何错误，我得到的仅仅是未ugluified代码！

这是我的相同代码=> https://github.com/IamManchanda/gulp-webpack/pull/7/

实际上，更具体地说，这是我的config.production.js

const UglifyjsWebpackPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  mode: 'production',
  devtool: 'source-map',
  output: {
    filename: 'scripts.js',
  },
  optimization: {
    minimizer: [
      new UglifyjsWebpackPlugin({
        sourceMap: true,
      }),
    ],
  },
};

我想念什么吗？我还需要更多RTFM吗？你们能帮我吗 让我知道您是否需要其他详细信息。预先感谢。

编辑：以下是同一期的视频演示：https://drive.google.com/file/d/1Xa1E3vnXR2_fFuqZ8b5Hu4-kMb2gD2FT/view

Answer 1

请将输出文件名更改为scripts.min.js，并将属性compress用作true。

const UglifyjsWebpackPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  mode: 'production',
  devtool: 'source-map',
  output: {
    filename: 'scripts.min.js',
  },
  optimization: {
    minimizer: [
      new UglifyjsWebpackPlugin({
        sourceMap: true,
        minify(file, sourceMap) {
        // https://github.com/mishoo/UglifyJS2#minify-options
        const uglifyJsOptions = { /* your `uglify-js` package options */ };

        if (sourceMap) {
          uglifyJsOptions.sourceMap = {
            content: sourceMap,
          };
        }

        return require('uglify-js').minify(file, uglifyJsOptions);
       }
      }),
    ],
  },
};

Answer 2

因此，当我紧急需要此服务时，我已经使用gulp代替了webpack来完成工作...话虽如此...仍在寻找webpack解决方案

无论如何，这是我基于Gulp的（gulpfile.js）解决方案=> https://github.com/IamManchanda/gulp-webpack/pull/8

1。

yarn add --dev gulp-uglify

2。

const gulpUglify = require('gulp-uglify');

3。

...((mode === 'production') ? [gulpUglify()] : []),

我认为现在对我来说重要的是，这对我有效：）

Answer 3

只需定义

new UglifyjsWebpackPlugin在plugins

{
  'plugins': [
    new UglifyJsPlugin({
      'sourceMap': false,
      'parallel': true
    })
  ]
}

请勿使用optimization.minimizer