Webpack 4 - Come configurare minimizzare?

Webpack 4 viene fornito con la seguente dichiarazione:

webpack.optimize.UglifyJsPlugin è stato rimosso, utilizza invece config.optimization.minimize.

Abbastanza giusto, ma non riesco a trovare alcuna informazione sulla configurazione dell'istanza di UglifyJsPlugin in esecuzione sotto il cofano, ad esempio per cambiare la directory della cache. Può essere fatto?

Non è possibile modificare la configurazione predefinita.

Tuttavia, puoi utilizzare l' optimization.minimizerimpostazione per creare un'istanza personale UglifyJsPlugin. Usando 4.0 abbiamo usato questo esempio per ottenere mappe sorgente anche quando modeè impostato ad 'production'esempio (non più necessario a partire dalla 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
      })
    ]
  }
};

Senza aggiungere uglifyjs-webpack-plugin, puoi semplicemente aggiungerlo alla fine del tuo file webpack.prod.config.js :

 optimization: {
   minimize: false
 }

Puoi provare questo

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

webpack.config.js

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

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

documentazione webpack

Corri:

yarn add uglifyjs-webpack-plugin --dev

Riferimento: risposta di Alfonso Pérez

Coloro che vengono dietro di me, si sono resi conto che questo errore fuorviante non era correlato alla mia corretta configurazione del webpack, ma in realtà non offline-pluginera aggiornato e causava questo problema. Aveva bisogno di essere aggiornato. Vedi il problema di github: https://github.com/webpack-contrib/uglifyjs-webpack-plugin/issues/234#issuecomment-369134047

Dovresti selezionare l' popzione: https://webpack.js.org/guides/production/#cli-alternatives : questo flag dice a Webpack di ottimizzare la tua build per l'ambiente di produzione. Puoi usarlo con la nuova "produzione" modeper una build più piccola.