title: Correct way to use minimize javascript in webpack.config.js
body: <p>I'm following a tutorial about <code>webpack</code>, but it seems that the tutorial is making use of an older version of <code>webpack</code>. I'm trying to minimize the <code>.js</code> files but every time I run <code>npm run webpack</code> I get this error message in the console: </p>
  
  <blockquote>
    <p>webpack.optimize.UglifyJsPlugin has been removed, please use
    config.optimization.minimize instead.</p>
  </blockquote>
  
  <p>How do I use that <code>config.optimization.minimize</code> ? I've been googling for some time but with no success... What do I need to change in my <code>webpack.config.js</code>?</p>
  
  <p>This is my <code>webpack.config.js</code>:</p>
  
  <pre><code>const path = require('path');
  const webpack = require('webpack');
  const ExtractTextPlugin = require('extract-text-webpack-plugin');
  const extractCSS = new ExtractTextPlugin('allstyles.css');
  
  module.exports = {
    entry: './wwwroot/source/app.js',
    output: {
      path: path.resolve(__dirname, 'wwwroot/dist'),
      filename: 'bundle.js'
    },
    plugins: [
      extractCSS,
      new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery',
        Popper: ['popper.js', 'default']
      }),
      new webpack.optimize.UglifyJsPlugin()
    ],
    module: {
      rules: [
        {test: /\.css$/, use: extractCSS.extract(['css-loader?minimize'])},
        {test: /\.js$/,//      
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['env']
            }
          }
        }
      ]
    }
  };
  </code></pre>
  
  <p><code>package.json</code>:</p>
  
  <pre><code>{
    "name": "WebpackBlogExample",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" &amp;&amp; exit 1",
      "wbp": "webpack"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "devDependencies": {
      "babel-core": "^6.26.0",
      "babel-loader": "^7.1.3",
      "babel-preset-env": "^1.6.1",
      "bootstrap": "^4.0.0-beta.2",
      "css-loader": "^0.28.10",
      "extract-text-webpack-plugin": "^3.0.2",
      "jquery": "^3.3.1",
      "popper.js": "^1.12.9",
      "style-loader": "^0.20.2",
      "uglifyjs-webpack-plugin": "^1.2.2",
      "webpack": "^4.0.1",
      "webpack-cli": "^2.0.9"
    },
    "dependencies": {}
  }
  </code></pre>