question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

compiler.hooks.done.tapAsync

See original GitHub issue

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()]
};

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:11 (6 by maintainers)

github_iconTop GitHub Comments

13reactions
alexander-akaitcommented, Feb 27, 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 😄 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

1reaction
kbradl16commented, Feb 22, 2020

Thanks! I’ll give it a shot too, never messed with webpack plugin so I’m flying blind 😛

Read more comments on GitHub >

github_iconTop Results From Across the Web

Compiler Hooks | webpack
The Compiler module is the main engine that creates a compilation instance ... Depending on the hook type, tapAsync and tapPromise may also...
Read more >
How to rewrite compiler.plugin('done'...) with the new ...
compiler.hooks.done.tapAsync('webpack', function(stat) {}) ... webpackCompiler.hooks.done.tap('BuildStatsPlugin', something...);.
Read more >
webpack.Compiler.hooks JavaScript and Node.js ... - Tabnine
Invalidate renderer's module cache after Webpack Compilation compiler.hooks.compilation.tap("done", () => { Object.keys(require.cache).
Read more >
Webpack Plugins - Dennis O'Keeffe Notes
Use webpack/lib/Compiler.js to see all the possible hooks! The important part of any hook is the tapAsync method: 1compiler.hooks.done.
Read more >
Plugin API - Webpack 4 - W3cubDocs
The class exposes tap , tapAsync , and tapPromise methods which plugins can ... The compiler hooks each note the underlying Tapable hook...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found