supprimer de la console.journaux avec Webpack & Uglify

Question

Je suis en train de retirer de la console.journaux avec Webpack est Uglify plugin, mais il semble que Uglify plugin est livré avec Webpack n'ont pas cette option, il n'est pas mentionné dans la documentation.

Je suis de l'initialisation uglify de webpack comme ceci: new webpack.optimize.UglifyJsPlugin()

Ma compréhension est que je peux utiliser autonome Uglify lib pour obtenir toutes les options, mais je ne sais pas lequel?

Le problème est qu' drop_console ne fonctionne pas.

Answer 1

Avec UglifyJsPlugin nous pouvons gérer les commentaires, les avertissements, les journaux de la console , mais ce ne sera pas une bonne idée d'enlever toutes ces, le mode de développement. Vérifiez d'abord si vous exécutez webpack pour prov env or dev env, si elle est prod env ensuite, vous pouvez supprimer tous ces, comme ceci:

var debug = process.env.NODE_ENV !== "production";

plugins: !debug ? [
   new webpack.optimize.UglifyJsPlugin({

     // Eliminate comments
        comments: false,

    // Compression specific options
       compress: {
         // remove warnings
            warnings: false,

         // Drop console statements
            drop_console: true
       },
    })
]
: []

Référence: https://github.com/mishoo/UglifyJS2#compressor-options

Mise à JOUR en 2019 Besoin d'utiliser terser plugin maintenant pour ES6 soutien dans webpack v4 https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions

webpack.config.js

module.exports = {
  optimization: {
    minimizer: [
      new TerserPlugin({
        sourceMap: true, // Must be set to true if using source-maps in production
        terserOptions: {
          compress: {
            drop_console: true,
          },
        },
      }),
    ],
  },
};

Answer 2

Essayez drop_console:

plugins: [
    new Webpack.optimize.UglifyJsPlugin({
      compress: {
        drop_console: true,
      }
    }
]

Mise à jour: Pour webpack v4 il a changé un peu:

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

...

optimization: {
  minimizer: [
    new UglifyJSPlugin({
      uglifyOptions: {
        compress: {
          drop_console: true,
        }
      }
    })
  ]
}

Answer 3

C'est la nouvelle syntaxe pour Webpack v4:

optimization: {
  minimizer: [
    new UglifyJSPlugin({
      uglifyOptions: {
        compress: {
          drop_console: true
        },
        output: {
          comments: false
        }
      },
    }),
  ],
},

Answer 4

Pour uglifyjs-webpack-plugin, les options d'habillage intérieur d'un uglifyOptions objet:

    plugins: [
    new UglifyJSPlugin({
        uglifyOptions: {
            compress: {
                drop_console: true
            }
        }
    })
]

Answer 5

J'ai ajouté une réponse globale pour webpack v4 avec configuration de débogage

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
var debug = process.env.NODE_ENV !== "production";

.....
optimization: {
        minimizer: !debug ? [
            new UglifyJsPlugin({

                    // Compression specific options
                    uglifyOptions: {
                        // Eliminate comments
                        comments: false,

                        compress: {
                            // remove warnings
                                warnings: false,

                            // Drop console statements
                                drop_console: true
                        },
                    }

                })
            ]
            : []
    }

Mes scripts dans le paquet.json sont comme suit:

"webpackDev": "npm run clean && export NODE_ENV=development && npx webpack",
"webpackProd": "npm run clean && export NODE_ENV=production && npx webpack -p"