webpack 2.1.0-beta.25 error unknown property postLoaders

Question

webpack 2.1.0-beta.25 (at least beta 23+) throws the following error if I specify postLoaders: [] in my webpack.config:

(just the interesting bit):

configuration.module has an unknown property 'postLoaders'.

(the full stack):

23 09 2016 13:37:31.599:ERROR [preprocess]: Can not load "webpack"!
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'postLoaders'. These properties are valid:
object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, loaders?, noParse?, rules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? }
Options affecting the normal modules (`NormalModuleFactory`).
    at webpack (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/webpack/lib/webpack.js:16:9)
    at new Plugin (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/karma-webpack/lib/karma-webpack.js:63:18)
    at invoke (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:75:15)
    at Array.instantiate (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:59:20)
    at get (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:48:43)
    at /Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:71:14
    at Array.map (native)
    at Array.invoke (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:70:31)
    at Injector.get (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:48:43)
    at instantiatePreprocessor (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/karma/lib/preprocessor.js:55:20)
    at Array.forEach (native)
    at createPreprocessor (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/karma/lib/preprocessor.js:74:20)
    at Array.invoke (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:75:15)
    at get (/Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:48:43)
    at /Users/jared.youtsey/src/Quartz/Common/source/node_modules/di/lib/injector.js:71:14
    at Array.map (native)

My webpack.config:

process.env.npm_lifecycle_event = 'test';
var webpack = require('webpack');
var path = require('path');
var NODE_MODULES = root("node_modules");

function root(args) {
    args = Array.prototype.slice.call(arguments, 0);
    return path.join.apply(path, [__dirname].concat(args));
}

module.exports = {
    entry: {},

    resolve: {
        modules: [root(""), NODE_MODULES],
        extensions: [".ts", ".js", ".json", ".css", ".scss", ".html"]
    },

    module: {
        loaders: [
            {
                test: /\.ts$/,
                loader: "ts",
                query: {
                    "ignoreDiagnostics": [
                        2403, // 2403 -> Subsequent variable declarations
                        2300, // 2300 -> Duplicate identifier
                        2374, // 2374 -> Duplicate number index signature
                        2375, // 2375 -> Duplicate string index signature
                        2502  // 2502 -> Referenced directly or indirectly
                    ]
                },
                exclude: [/node_modules\/?!(@angular)/]
            },

            { test: /\.scss$/, loader: "null" },
            { test: /\.css$/, loader: "null" },
            { test: /\.html$/, loader: "raw" }
        ],
        postLoaders: [
            {
                test: /\.(js|ts)$/,
                include: [root("")],
                loader: "istanbul-instrumenter-loader",
                exclude: [/.+-spec\.ts$/, /\.e2e\.ts$/, NODE_MODULES]
            }
        ]
    }
};

It appears that the documentation for loaders on the webpack site still references pre/postLoaders. But either one, even if empty, will still generate this error.

Has the schema changed? Where should the postLoaders go, or, how should a postLoader be configured?

Answer 1

There is a new enforce: pre or post property which is introduced in the release notes for v2.1.0-beta.24 and v2.1.0-beta.25: https://github.com/webpack/webpack/releases

We had to move preLoaders from:

module: {
  preLoaders: [
    {
      test: /\.jsx?$/,
      loader: 'eslint',
      exclude: /(node_modules)/
    }
  ],
  loaders: [
    ...
  ]
}

to this:

module: {
  loaders: [
    {
      test: /\.jsx?$/,
      loader: 'eslint',
      exclude: /(node_modules)/,
      enforce: 'pre'
    },
    ...
  ]
}

So I would guess your config would end up looking something like:

process.env.npm_lifecycle_event = 'test';
var webpack = require('webpack');
var path = require('path');
var NODE_MODULES = root("node_modules");

function root(args) {
    args = Array.prototype.slice.call(arguments, 0);
    return path.join.apply(path, [__dirname].concat(args));
}

module.exports = {
    entry: {},

    resolve: {
        modules: [root(""), NODE_MODULES],
        extensions: [".ts", ".js", ".json", ".css", ".scss", ".html"]
    },

    module: {
        loaders: [
            {
                test: /\.ts$/,
                loader: "ts",
                query: {
                    "ignoreDiagnostics": [
                        2403, // 2403 -> Subsequent variable declarations
                        2300, // 2300 -> Duplicate identifier
                        2374, // 2374 -> Duplicate number index signature
                        2375, // 2375 -> Duplicate string index signature
                        2502  // 2502 -> Referenced directly or indirectly
                    ]
                },
                exclude: [/node_modules\/?!(@angular)/]
            },

            { test: /\.scss$/, loader: "null" },
            { test: /\.css$/, loader: "null" },
            { test: /\.html$/, loader: "raw" },

            {
                test: /\.(js|ts)$/,
                include: [root("")],
                loader: "istanbul-instrumenter-loader",
                exclude: [/.+-spec\.ts$/, /\.e2e\.ts$/, NODE_MODULES],
                enforce: 'post'
            }
        ]
    }
};