Webpack 2: Director router is not working after compilation process

Question

What is the current behavior?

It seems that some parts of director router constructor function are removed causing an unexpected error.

NOTE: This issue was not present in Webpack version 1.14.0.

Reproduction https://github.com/marcalexiei/director-webpack-issue

Instructions in the readme.

There are two branches:

• "master" where the issue can be reproduced.
• "web-pack-1-14-0" has the previous version and has no errors.

What is the expected behavior? No errors are generated and router init is a function.

Configuration file

    module.exports = {
      entry: {
        // app's entry point
        app: './src/app.js',

      },
      output: {
        publicPath: '/public/',
        path: path.join(__dirname, 'public'),
        pathinfo: true,
        filename: '[name].bundle.js',
      },
      resolve: {
        modules: [
          path.join(__dirname, './') , // frontend-app
          'node_modules'
        ],
        extensions: ['.js'],
      },
      module: {
        rules: [
          {
            test: /\.js$/,
            loader: 'babel-loader',

            exclude: /node_modules/,
          },
        ],
      },
    };

System specs

• Chrome 55.0.2883.95
• Safari 10.0.3
• Node 6.3.1
• Webpack 2.2.1
• MacOS 10.12.3

Answer 1

TLDR: Add

resolve: {
  mainFields: ['browserify', 'browser', 'module', 'main']
}

to your config.

---

Explanation:

In webpack1 (https://webpack.github.io/docs/configuration.html#resolve-packagemains), the default value for that field was:

["webpack", "browser", "web", "browserify", ["jam", "main"], "main"]

However, in webpack2 (https://webpack.js.org/configuration/resolve/#resolve-mainfields) the default value is:

["browser", "module", "main"]

Note that a few items are missing in webpack2 default values. In particular, browserify is not present.

This are the builds exported by director:

  "browserify": "./build/director",
  "main": "./lib/director",

./build/director is the browser compatible build, ./lib/director is the node one. You have to tell webpack2 to use ./build/director, hence the "browserify" entry in your config.