Webpack 4 - Como configurar o minimize?

114

Webpack 4 vem com a seguinte declaração:

webpack.optimize.UglifyJsPlugin foi removido, use config.optimization.minimize.

É justo, mas não consigo encontrar nenhuma informação sobre como configurar a instância UglifyJsPlugin em execução nos bastidores, por exemplo, para alterar o diretório de cache. Isso pode ser feito?

csvan
fonte
2
Para referência, os UglifyJsPluginpadrões estão listados aqui
davnicwil

Respostas:

95

Não é possível modificar a configuração padrão.

Você pode usar a optimization.minimizerconfiguração para instanciar o seu UglifyJsPlugin, no entanto. Usando 4.0, usamos este exemplo para obter mapas de origem mesmo quando modeestá definido como, 'production'por exemplo (não é mais necessário a partir de 4.1.1):

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

module.exports = {
  optimization: {
    minimizer: [
      // we specify a custom UglifyJsPlugin here to get source maps in production
      new UglifyJsPlugin({
        cache: true,
        parallel: true,
        uglifyOptions: {
          compress: false,
          ecma: 6,
          mangle: true
        },
        sourceMap: true
      })
    ]
  }
};
Beau
fonte
95
O webpack 4 não deveria ter configuração zero?
connexo 01 de
3
Isso requer que eu instancie o plug-in, porém, quero apenas modificar a configuração existente.
csvan 01 de
4
E tenha em mente que você pode precisar fazer yarn add uglifyjs-webpack-plugin --dev;)
Alfonso Pérez
2
e aqui; procure por "optimization.minimizer" nesta página: medium.com/webpack/webpack-4-mode-and-optimization-5423a6bc597a
Beau
3
@ AlfonsoPérez webpack já instala uglifyjs-webpack-plugincomo uma dependência
Beau
5

Sem adicionar uglifyjs-webpack-plugin, você pode simplesmente adicionar isso ao final do seu arquivo webpack.prod.config.js :

 optimization: {
   minimize: false
 }
Nafis
fonte
2

Você pode tentar isso

npm install uglifyjs-webpack-plugin --save-dev

webpack.config.js

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

module.exports = {
  optimization: {
    minimizer: [new UglifyJsPlugin()],
  },
};

documentação do webpack

Sarath Ak
fonte
1

Apenas corra:

yarn add uglifyjs-webpack-plugin --dev

Referência: Resposta de Alfonso Pérez

Rafael Corrêa Gomes
fonte
-4

Você deve verificar a popção: https://webpack.js.org/guides/production/#cli-alternatives : este sinalizador diz ao Webpack para otimizar sua construção para o ambiente de produção. Você pode usá-lo com a nova "produção" modepara uma construção menor.

KorHosik
fonte
2
Obrigado, mas estou tentando modificar a configuração padrão.
csvan 01 de