Bug: TypeError: __webpack_require__.e is not a function (for target node?)

Bug: I’m using webpack to build the server using target node, but the output claims requireEnsure as undefined!

TypeError: __webpack_require__.e is not a function

The function is related to webpack requireEnsure. It makes totally sense that we don’t have requireEnsure (which appends html to the DOM) on the server, but why it’s requiring it?

The webpack configuration for the server is down to the following:

[2] { devtool: 'source-map',
[2]   context: '/opt/app',
[2]   resolve:
[2]    { modules: [ 'node_modules' ],
[2]      extensions: [ '.json', '.js', '.jsx', '.css', '.scss' ] },
[2]   module:
[2]    { rules:
[2]       [ { test: /\.css$/,
[2]           include: /(flexboxgrid|normalize\.css)/,
[2]           use:
[2]            [ { loader: 'css-loader/locals',
[2]                options: { modules: true, importLoaders: 2, localIdentName: '[local]' } },
[2]              { loader: 'autoprefixer-loader',
[2]                options: { browsers: 'last 2 version' } } ] },
[2]         { test: /\.jsx?$/,
[2]           exclude: /node_modules/,
[2]           use:
[2]            [ { loader: 'babel-loader',
[2]                options:
[2]                 { plugins:
[2]                    [ 'transform-runtime',
[2]                      'add-module-exports',
[2]                      'transform-decorators-legacy',
[2]                      'transform-react-display-name',
[2]                      'transform-class-properties',
[2]                      [ 'react-intl',
[2]                        { messagesDir: './build/messages/', enforceDescriptions: true } ],
[2]                      [ 'root-import',
[2]                        [ { rootPathPrefix: '~', rootPathSuffix: 'src' },
[2]                          { rootPathPrefix: '@', rootPathSuffix: 'rest' },
[2]                          { rootPathPrefix: '#', rootPathSuffix: 'src/modules' } ] ],
[2]                      'syntax-dynamic-import' ],
[2]                   presets: [ 'react', 'es2015', 'stage-0' ],
[2]                   ignore: [ 'node_modules' ] } } ] },
[2]         { test: /\.less$/,
[2]           use:
[2]            [ { loader: 'css-loader/locals',
[2]                options:
[2]                 { modules: true,
[2]                   importLoaders: 2,
[2]                   sourceMap: true,
[2]                   localIdentName: '[local]___[hash:base64:5]' } },
[2]              { loader: 'autoprefixer-loader',
[2]                options: { browsers: 'last 2 version' } },
[2]              { loader: 'less-loader',
[2]                options: { outputStyle: 'expanded', sourceMap: true } } ] },
[2]         { test: /\.scss$/,
[2]           use:
[2]            [ { loader: 'css-loader/locals',
[2]                options:
[2]                 { modules: true,
[2]                   importLoaders: 2,
[2]                   sourceMap: true,
[2]                   localIdentName: '[local]___[hash:base64:5]' } },
[2]              { loader: 'autoprefixer-loader',
[2]                options: { browsers: 'last 2 version' } },
[2]              { loader: 'sass-loader',
[2]                options: { outputStyle: 'expanded', sourceMap: true } } ] },
[2]         { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
[2]           use:
[2]            [ { loader: 'url-loader',
[2]                options:
[2]                 { limit: 10000,
[2]                   mimetype: 'application/font-woff',
[2]                   emitFile: false } } ] },
[2]         { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
[2]           use:
[2]            [ { loader: 'url-loader',
[2]                options:
[2]                 { limit: 10000,
[2]                   mimetype: 'application/font-woff',
[2]                   emitFile: false } } ] },
[2]         { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
[2]           use:
[2]            [ { loader: 'url-loader',
[2]                options:
[2]                 { limit: 10000,
[2]                   mimetype: 'application/octet-stream',
[2]                   emitFile: false } } ] },
[2]         { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
[2]           use: [ { loader: 'file-loader', options: { emitFile: false } } ] },
[2]         { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
[2]           use:
[2]            [ { loader: 'url-loader',
[2]                options:
[2]                 { limit: 10000,
[2]                   mimetype: 'application/octet-stream',
[2]                   emitFile: false } } ] },
[2]         { test: /\.(jpg|png|jpeg|gif|svg)$/,
[2]           use:
[2]            [ { loader: 'url-loader',
[2]                options: { limit: 10240, emitFile: false } } ] } ] },
[2]   plugins:
[2]    [ DefinePlugin {
[2]        definitions:
[2]         { __CLIENT__: false,
[2]           __SERVER__: true,
[2]           __DEVELOPMENT__: true,
[2]           __DEVTOOLS__: true } },
[2]      LimitChunkCountPlugin { options: { maxChunks: 1 } } ],
[2]   name: 'server',
[2]   output:
[2]    { path: '/opt/app/build/server',
[2]      libraryTarget: 'commonjs2',
[2]      filename: '[name].js',
[2]      chunkFilename: '[name].js',
[2]      pathinfo: true },
[2]   entry: { server: [ './src/server.js' ] },
[2]   target: 'node',
[2]   node: { __dirname: false, __filename: false },
[2]   externals: [ [Function] ] }

The undefined function is only mentioned once in the outputted code, but the webpackAsyncContext apparently is executed for every module.

function webpackAsyncContext(req) {
        var ids = map[req];
        if(!ids)
                return Promise.reject(new Error("Cannot find module '" + req + "'."));
        return __webpack_require__.e(ids[1]).then(function() {
                return __webpack_require__(ids[0]);
        });
};

The expected behavior

I believe that the build with target node shouldn’t be trying to use requireEnsure, or maybe it is missing the libraryTarget for commonjs2. The problem is that the webpack outputted file is trying to execute __webpack_require__.e but it doesn’t defined the method anywhere on the output, so it shouldn’t be executing it.

My configuration is

node v.7.7.2
npm 4.1.2
webpack 2.2.0
babel-core 6.24.1
babel-loader 7.0.0

Author: Fantashit

1 thought on “Bug: TypeError: __webpack_require__.e is not a function (for target node?)

  1. Yes, I solved by cloning https://github.com/airbnb/babel-plugin-dynamic-import-node and updating the file src/index.js

    Where you have

    SOURCE: (t.isStringLiteral(importArgument) || t.isTemplateLiteral(importArgument))
                ? path.node.arguments
                : t.templateLiteral([t.templateElement({ raw: '', cooked: '' }), t.templateElement({ raw: '', cooked: '' }, true)], path.node.arguments),
    

    I replaced by only

    SOURCE: path.node.arguments,
    

    That fixed the issue of the SyntaxError: Unexpected token )

    I closed the issue because the problem was not on webpack itself.

Comments are closed.