Webpack-bundle-analyzer: compiler.hooks.done.tapAsync

Created on 20 Feb 2020  路  10Comments  路  Source: webpack-contrib/webpack-bundle-analyzer

I comment out my new BundleAnalyzerPlugin() line and webpack bundles successfully. When adding the BundleAnalyzerPlugin() webpack fails with below error/stacktrace.

I saw this https://github.com/webpack-contrib/webpack-bundle-analyzer/issues/273 but don't know how they fixed their issue.

Stacktrace

C:\projects\myProjectPath\node_modules\webpack-bundle-analyzer\lib\BundleAnalyzerPlugin.js:90
      compiler.hooks.done.tapAsync('webpack-bundle-analyzer', done);
                          ^

TypeError: Cannot read property 'tapAsync' of undefined
    at BundleAnalyzerPlugin.apply (C:\projects\myProjectPath\node_modules\webpack-bundle-analyzer\
lib\BundleAnalyzerPlugin.js:90:27)
    at C:\projects\myProjectPath\node_modules\enhanced-resolve\lib\ResolverFactory.js:314:10
    at Array.forEach (<anonymous>)
    at Object.exports.createResolver (C:\projects\myProjectPath\node_modules\enhanced-resolve\lib\
ResolverFactory.js:313:10)
    at ResolverFactory._create (C:\projects\myProjectPath\node_modules\webpack\lib\ResolverFactory
.js:57:28)
    at ResolverFactory.get (C:\projects\myProjectPath\node_modules\webpack\lib\ResolverFactory.js:
49:28)
    at NormalModuleFactory.getResolver (C:\projects\myProjectPath\node_modules\webpack\lib\NormalM
oduleFactory.js:521:31)
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:165:32
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:129:4
    at handleExternal (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlu
gin.js:28:34)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:103:26
    at next (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:65:
43)
    at handleExternals (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPl
ugin.js:71:7)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:101:5
    at handleExternal (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlu
gin.js:28:34)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:103:26
    at next (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:65:
43)
    at handleExternals (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPl
ugin.js:71:7)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:101:5
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:400:5
    at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\nod
e_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesWaterfallHook.lazyCompileHook (C:\projects\myProjectPath\node_modules\tapable\li
b\Hook.js:154:20)
    at NormalModuleFactory.create (C:\projects\myProjectPath\node_modules\webpack\lib\NormalModule
Factory.js:381:28)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compilation.js:1063:18
    at Semaphore.acquire (C:\projects\myProjectPath\node_modules\webpack\lib\util\Semaphore.js:29:
4)
    at Compilation._addModuleChain (C:\projects\myProjectPath\node_modules\webpack\lib\Compilation
.js:1062:18)
    at Compilation.addEntry (C:\projects\myProjectPath\node_modules\webpack\lib\Compilation.js:116
4:8)
    at C:\projects\myProjectPath\node_modules\webpack\lib\SingleEntryPlugin.js:46:17
    at AsyncParallelHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\node_modul
es\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1)
    at AsyncParallelHook.lazyCompileHook (C:\projects\myProjectPath\node_modules\tapable\lib\Hook.
js:154:20)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compiler.js:669:20
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\node_modules
\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (C:\projects\myProjectPath\node_modules\tapable\lib\Hook.js
:154:20)
    at Compiler.compile (C:\projects\myProjectPath\node_modules\webpack\lib\Compiler.js:662:28)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compiler.js:321:11
    at Compiler.readRecords (C:\projects\myProjectPath\node_modules\webpack\lib\Compiler.js:529:11
)
T60273:[/c/projects/myProject]$ webpack
C:\projects\myProjectPath\node_modules\webpack-bundle-analyzer\lib\BundleAnalyzerPlugin.js:90
      compiler.hooks.done.tapAsync('webpack-bundle-analyzer', done);
                          ^

TypeError: Cannot read property 'tapAsync' of undefined
    at BundleAnalyzerPlugin.apply (C:\projects\myProjectPath\node_modules\webpack-bundle-analyzer\
lib\BundleAnalyzerPlugin.js:90:27)
    at C:\projects\myProjectPath\node_modules\enhanced-resolve\lib\ResolverFactory.js:314:10
    at Array.forEach (<anonymous>)
    at Object.exports.createResolver (C:\projects\myProjectPath\node_modules\enhanced-resolve\lib\
ResolverFactory.js:313:10)
    at ResolverFactory._create (C:\projects\myProjectPath\node_modules\webpack\lib\ResolverFactory
.js:57:28)
    at ResolverFactory.get (C:\projects\myProjectPath\node_modules\webpack\lib\ResolverFactory.js:
49:28)
    at NormalModuleFactory.getResolver (C:\projects\myProjectPath\node_modules\webpack\lib\NormalM
oduleFactory.js:521:31)
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:165:32
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:129:4
    at handleExternal (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlu
gin.js:28:34)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:103:26
    at next (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:65:
43)
    at handleExternals (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPl
ugin.js:71:7)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:101:5
    at handleExternal (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlu
gin.js:28:34)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:103:26
    at next (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:65:
43)
    at handleExternals (C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPl
ugin.js:71:7)
    at C:\projects\myProjectPath\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:101:5
    at C:\projects\myProjectPath\node_modules\webpack\lib\NormalModuleFactory.js:400:5
    at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\nod
e_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesWaterfallHook.lazyCompileHook (C:\projects\myProjectPath\node_modules\tapable\li
b\Hook.js:154:20)
    at NormalModuleFactory.create (C:\projects\myProjectPath\node_modules\webpack\lib\NormalModule
Factory.js:381:28)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compilation.js:1063:18
    at Semaphore.acquire (C:\projects\myProjectPath\node_modules\webpack\lib\util\Semaphore.js:29:
4)
    at Compilation._addModuleChain (C:\projects\myProjectPath\node_modules\webpack\lib\Compilation
.js:1062:18)
    at Compilation.addEntry (C:\projects\myProjectPath\node_modules\webpack\lib\Compilation.js:116
4:8)
    at C:\projects\myProjectPath\node_modules\webpack\lib\SingleEntryPlugin.js:46:17
    at AsyncParallelHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\node_modul
es\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1)
    at AsyncParallelHook.lazyCompileHook (C:\projects\myProjectPath\node_modules\tapable\lib\Hook.
js:154:20)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compiler.js:669:20
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\projects\myProjectPath\node_modules
\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (C:\projects\myProjectPath    at C:\projects\myProjectPath\node_modules\webpack\lib\Compi
ler.js:669:20
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\project
s\myProjectPath\node_modules\tapable\lib\HookCodeFactory.js:33:
10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (C:\projects\myProjectPath
er\node_modules\tapable\lib\Hook.js:154:20)
    at Compiler.compile (C:\projects\myProjectPath\node_modules
\webpack\lib\Compiler.js:662:28)
    at C:\projects\myProjectPath\node_modules\webpack\lib\Compi
ler.js:321:11
    at Compiler.readRecords (C:\projects\myProjectPath\node_mod
ules\webpack\lib\Compiler.js:529:11)

webpack.config.js

const path = require('path');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const nodeExternals = require('webpack-node-externals');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
  mode: 'production',
  entry: './src/main.ts',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: 'ts-loader',
        include: [path.resolve(__dirname, 'src')],
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.ts', '.js'],
    plugins: [
      new TsconfigPathsPlugin({
        configFile: './tsconfig.build.json'
      }),
      new BundleAnalyzerPlugin({ generateStatsFile: true })
    ]
  },
  performance: {
    hints: 'warning', 
    maxAssetSize: 3000000
  },
  target: 'node',
  externals: [nodeExternals()]
};
Has reproduction case
Source
picture kbradl16

Most helpful comment

Guys, it is just typo in configuration:

resolve: {
    extensions: ['.ts', '.js'],
    plugins: [
      new TsconfigPathsPlugin({
        configFile: './tsconfig.build.json'
      }),
      new BundleAnalyzerPlugin({ generateStatsFile: true })
    ]
  },

The BundleAnalyzerPlugin plugin is not a plugin for resolver :smile: And it is expected error, because compiler here is resolver and the done hook doesn't exists for resolver.

Valid configuration:

const path = require('path');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const nodeExternals = require('webpack-node-externals');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
  mode: 'production',
  entry: './src/main.ts',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: 'ts-loader',
        include: [path.resolve(__dirname, 'src')],
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.ts', '.js'],
    plugins: [
      new TsconfigPathsPlugin({
        configFile: './tsconfig.build.json'
      })
    ]
  },
  plugins: [
    new BundleAnalyzerPlugin({ generateStatsFile: true })
  ],
  performance: {
    hints: 'warning', 
    maxAssetSize: 3000000
  },
  target: 'node',
  externals: [nodeExternals()]
};

I think we can close the issue

picture alexander-akait on 27 Feb 2020
👍4 🎉2 ❤1 😄1

All 10 comments

Interesting 馃. Would you be able to create a reproduction repository that shows this error? Otherwise it's too difficult for us to debug what is happening.

valscion picture valscion on 20 Feb 2020

@valscion I'm not really allowed to share public repos without getting company permission.

kbradl16 picture kbradl16 on 21 Feb 2020

Thanks I've forked the repo, you should be good to delete your own repository. I can see the same error message on my own machine.

Hopefully I'll have time to dig into debugging this further at some point :relaxed:

valscion picture valscion on 21 Feb 2020
👍1

Thanks! I鈥檒l give it a shot too, never messed with webpack plugin so I鈥檓 flying blind :P

kbradl16 picture kbradl16 on 22 Feb 2020
😄1

I tried looking into it a bit but I don't understand compiler.hooks. It does not contain any of the hooks the docs state. compiler.hooks.done does not exist

kbradl16 picture kbradl16 on 23 Feb 2020

I'm equally rusty about the innards of webpack and hooks, so I'd be confused too 馃槄. If you find any information about the hooks, or find old pull requests where we've done changes to the relevant code, it might be helpful to link them here 鈽猴笍

valscion picture valscion on 23 Feb 2020

I鈥檓 going to open a ticket with webpack. Can you link the example repo

kbradl16 picture kbradl16 on 24 Feb 2020

Here: https://github.com/valscion/webpack-bundle-analyzer-issue-333

valscion picture valscion on 24 Feb 2020

Guys, it is just typo in configuration:

resolve: {
    extensions: ['.ts', '.js'],
    plugins: [
      new TsconfigPathsPlugin({
        configFile: './tsconfig.build.json'
      }),
      new BundleAnalyzerPlugin({ generateStatsFile: true })
    ]
  },

The BundleAnalyzerPlugin plugin is not a plugin for resolver :smile: And it is expected error, because compiler here is resolver and the done hook doesn't exists for resolver.

Valid configuration:

const path = require('path');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const nodeExternals = require('webpack-node-externals');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
  mode: 'production',
  entry: './src/main.ts',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: 'ts-loader',
        include: [path.resolve(__dirname, 'src')],
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.ts', '.js'],
    plugins: [
      new TsconfigPathsPlugin({
        configFile: './tsconfig.build.json'
      })
    ]
  },
  plugins: [
    new BundleAnalyzerPlugin({ generateStatsFile: true })
  ],
  performance: {
    hints: 'warning', 
    maxAssetSize: 3000000
  },
  target: 'node',
  externals: [nodeExternals()]
};

I think we can close the issue

alexander-akait picture alexander-akait on 27 Feb 2020
👍4 🎉2 ❤1 😄1

Yes, we can close it. Thanks for spotting the bug in configuration! Totally didn't see that myself.

valscion picture valscion on 27 Feb 2020
Was this page helpful?
0 / 5 - 0 ratings

Related issues

n8sabes picture n8sabes  路  4Comments
mulholio picture mulholio  路  3Comments
gaokun picture gaokun  路  5Comments
muuvmuuv picture muuvmuuv  路  3Comments
s524797336 picture s524797336  路  8Comments