CODEWITHSUNDEEP
webpackuglifyjs
Anthony Kong
Anthony Kong

Reputation: 40814

TypeError: webpack.LoaderOptionsPlugin is not a function

This is my webpack config for the production environment.

    var path = require('path');
    var webpack = require('webpack');
    var precss = require('precss');
    var autoprefixer = require('autoprefixer');
    var SaveAssetsJson = require('assets-webpack-plugin');

    ...

    console.log('Build optimized for production\n');

    config.output.filename = '[hash].plan.js';

    config.module.loaders.push({
      test: /\.js$/,
      loaders: ['babel'],
      exclude: /node_modules/,
      include: path.join(__dirname, 'app'),
    });

It is consumed via npm/package.json. In the package.json scripts section, here is the build target:

"build": "NODE_ENV=production webpack -p --config webpack.config.js",

Now I want to turn off output script uglification for a certain environment mainly for debug purpose.

Here is my new additional webpack configuration:

 switch (process.env.NODE_ENV) {
 case 'staging':
    console.log(`Build optimized for ${process.env.NODE_ENV}\n`);

    config.output.filename = '[hash].plan.js';

    config.module.loaders.push({
      test: /\.js$/,
      loaders: ['babel'],
      exclude: /node_modules/,
      include: path.join(__dirname, 'app'),
    });

    config.plugins = [
      new webpack.LoaderOptionsPlugin({
            minimize: true,
            debug: false
        }),
        new webpack.optimize.UglifyJsPlugin({
            beautify: false,
            comments: false
        })
    ]
    break;
...

Related dependency inside package.json

 assets-webpack-plugin": "3.5.0",
"webpack": "1.13.3",

I copy the plugins config from the webpack documentation here https://webpack.js.org/guides/production-build/

However, when I run npm run build:staging, I got this error:

> [email protected] build:staging /Users/antkong/project
> NODE_ENV=staging webpack --config webpack.config.js

Build optimized for staging

/Users/antkong/project/webpack.config.js:82
      new webpack.LoaderOptionsPlugin({
      ^

Corresponding command in package.json:

"build:staging": "NODE_ENV=staging webpack --config webpack.config.js",

What did I miss? Is there any dev dependency I should install?

Upvotes: 1

Views: 2578

Answers (1)

Michael Jungo
Michael Jungo

Reputation: 33002

LoaderOptionsPlugin does not exist in webpack 1, it has been added to webpack 2 to make the transition easier.

You can either upgrade to webpack 2, which would be recommended at this point, or if you want or have to keep using webpack 1, you need to remove the LoaderOptionsPlugin from your plugins list.

Upvotes: 4

Related Questions