title: TypeError: webpack.optimize.UglifyJsPlugin is not a constructor
body: <p>I'm experiencing a <code>TypeError</code> and am unsure how to resolve it. I look forward to any help you can provide.  The following is the terminal output from <code>yarn run build</code>:</p>
  <pre><code>BUILD_DIR /Users/blakelucey/Desktop/fsd-next/build
  SRC_DIR /Users/blakelucey/Desktop/fsd-next/src
  [webpack-cli] TypeError: webpack.optimize.UglifyJsPlugin is not a constructor
      at module.exports (/Users/blakelucey/Desktop/fsd-next/webpack.config.js:118:7)
      at WebpackCLI.loadConfig (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:1589:33)
      at async WebpackCLI.resolveConfig (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:1677:38)
      at async WebpackCLI.createCompiler (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:2085:22)
      at async WebpackCLI.runWebpack (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:2213:20)
      at async Command.&lt;anonymous&gt; (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:850:25)
      at async Promise.all (index 1)
      at async Command.&lt;anonymous&gt; (/Users/blakelucey/Desktop/fsd-next/node_modules/webpack-cli/lib/webpack-cli.js:1516:13)
  error Command failed with exit code 2.
  </code></pre>
  <p>This is the <code>webpack.config.js</code>:</p>
  <pre><code>const webpack = require('webpack');
  const path = require('path');
  const ExtractTextPlugin = require('extract-text-webpack-plugin');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const CopyWebpackPlugin = require('copy-webpack-plugin');
  // const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
  
  const extractCSS = new ExtractTextPlugin('[name].fonts.css');
  const extractSCSS = new ExtractTextPlugin('[name].styles.css');
  // const MiniCssExtractPlugin = require(&quot;mini-css-extract-plugin&quot;);
  
  const BUILD_DIR = path.resolve(__dirname, 'build');
  const SRC_DIR = path.resolve(__dirname, 'src');
  
  console.log('BUILD_DIR', BUILD_DIR);
  console.log('SRC_DIR', SRC_DIR);
  
  module.exports = (env = {}) =&gt; {
    return {
      entry: {
        index: [SRC_DIR + '/index.tsx']
      },
      output: {
        path: BUILD_DIR,
        filename: '[name].bundle.js'
      },
      node: {
        fs: &quot;empty&quot;
      },
      resolve: {
        extensions: ['.ts', '.tsx', '.js', '.jsx', '.css', 'scss']
      },
      // watch: true,
      devtool: env.prod ? 'source-map' : 'cheap-module-eval-source-map',
      devServer: {
        contentBase: BUILD_DIR,
        //   port: 9001,
        compress: true,
        hot: true,
        open: true
      },
      // optimization: {
      //   minimizer: [
      //     new UglifyJsPlugin({sourceMap: true})
      //   ]
      // },
      module: {
        rules: [
          {
            test: /\.tsx?$/,
            use: [
              {
                loader: 'ts-loader'
              }
            ],
          },
          {
            test: /\.(js|jsx)$/,
            exclude: /node_modules/,
            use: {
              loader: 'babel-loader',
              options: {
                cacheDirectory: true,
                presets: ['react', 'env']
              }
            }
          },
          {
            test: /\.html$/,
            loader: 'html-loader'
          },
          {
            test: /\.(scss)$/,
            use: ['css-hot-loader'].concat(extractSCSS.extract({
              fallback: 'style-loader',
              use: [
                {
                  loader: 'css-loader',
                  options: { alias: { '../img': '../public/img' } }
                },
                {
                  loader: 'sass-loader'
                }
              ]
            }))
            // loader: MiniCssExtractPlugin.loader
          },
          {
            test: /\.css$/,
            use: extractCSS.extract({
              fallback: 'style-loader',
              use: 'css-loader'
            })
            // loader: MiniCssExtractPlugin.loader
          },
          {
            test: /\.(png|jpg|jpeg|gif|ico)$/,
            use: [
              {
                // loader: 'url-loader'
                loader: 'file-loader',
                options: {
                  name: './img/[name].[hash].[ext]'
                }
              }
            ]
          },
          {
            test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
            loader: 'file-loader',
            options: {
              name: './fonts/[name].[hash].[ext]'
            }
          }]
      },
      plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.optimize.UglifyJsPlugin({ sourceMap: true }),
        new webpack.NamedModulesPlugin(),
        extractCSS,
        extractSCSS,
        // new MiniCssExtractPlugin({
        //   // Options similar to the same options in webpackOptions.output
        //   // both options are optional
        //   filename: &quot;[name].css&quot;,
        //   chunkFilename: &quot;[id].css&quot;
        // }),
        new HtmlWebpackPlugin(
          {
            inject: true,
            template: './public/index.html'
          }
        ),
        new CopyWebpackPlugin([
          { from: './public/img', to: 'img' }
        ],
          { copyUnmodified: false }
        ),
        new CopyWebpackPlugin([
          { from: './public/robot.txt', to: 'robot.txt' }
        ],
          { copyUnmodified: false }
        )
      ]
    }
  };
  </code></pre>
  <p>I think I need to remove my comments here:</p>
  <pre><code>// const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
  </code></pre>
  <p>and here:</p>
  <pre><code>// optimization: {
      //   minimizer: [
      //     new UglifyJsPlugin({sourceMap: true})
      //   ]
      // },
  </code></pre>
  <p>But I'm not sure.  I look forward to and appreciate any input you can contribute, thank you.</p>