DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead #879

alhazmy13 · 2018-03-04T14:53:53Z

Error Message & Stack Trace

(node:71449) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
(node:71449) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead
TypeError: cb is not a function
    at compilation.plugin (/xxxxxx/.electron-vue/dev-runner.js:54:9)
    at Promise (eval at create (/xxxxx/node_modules/tapable/lib/HookCodeFactory.js:51:12), <anonymous>:11:16)
    at new Promise (<anonymous>)
    at AsyncSeriesWaterfallHook.eval [as promise] (eval at create (/xxxxxxx/node_modules/tapable/lib/HookCodeFactory.js:51:12), <anonymous>:4:8)
    at AsyncSeriesWaterfallHook.lazyCompileHook [as _promise] (/xxxxxx/node_modules/tapable/lib/Hook.js:35:21)
    at /xxxxx/node_modules/html-webpack-plugin/index.js:645:47
    at Promise.resolve.then.then.then.then.then.then.then.then.catch.then.then (/xxxxxx/node_modules/html-webpack-plugin/index.js:209:21)
    at <anonymous>

Config

module.exports = {
  entry: 'app.js',
  output: {
    path: 'dist',
    filename: 'index_bundle.js'
  },
  module: {
    rules: [
      ...
    ]
  }
  plugins: [
      new HtmlWebpackPlugin({
      filename: 'index.html',
      template: path.resolve(__dirname, '../src/index.ejs'),
      minify: {
        collapseWhitespace: true,
        removeAttributeQuotes: true,
        removeComments: true
      }
    }),
    ...
  ]
}

Html template file:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>togacat</title>
    <% if (htmlWebpackPlugin.options.nodeModules) { %>
      <script>
        require('module').globalPaths.push('<%= htmlWebpackPlugin.options.nodeModules.replace(/\\/g, '\\\\') %>')
      </script>
    <% } %>
  </head>
  <body>
    <div id="app"></div>
    <script>
      if (process.env.NODE_ENV !== 'development') window.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
    </script>

  </body>
</html>

Environment

Node.js v8.9.4
darwin 17.2.0
npm 5.6.0
webpack 4.1.0
html-webpack-plugin 3.0.4

The text was updated successfully, but these errors were encountered:

kagawagao · 2018-03-05T07:20:00Z

I think this bug is caused by webpack upgrade, Plugin API has been changed, but some plugins are not yet compatible with webpack v4

andriijas · 2018-03-05T11:51:41Z

html-webpack-plugin seem to use the old plugin api in two places:

https://github.com/jantimon/html-webpack-plugin/blob/master/index.js#L65
https://github.com/jantimon/html-webpack-plugin/blob/master/index.js#L85

there should be a check like in other parts of that file (if (compiler.hooks) {compiler.hooks.emit.tap} else {compiler.plugin(...)}

Gisleburt · 2018-03-05T13:52:40Z

Duplicate of #874

jantimon · 2018-03-06T11:59:27Z

Should be fixed in 3.0.5.

Gisleburt · 2018-03-06T12:34:48Z

Does fix deprecated warning, still doesn't load plugins in webpack 4. I've created #887 for that.

kagawagao · 2018-03-06T12:43:16Z

@jantimon
still here, call compiler.apply directly is also deprecated

jantimon · 2018-03-06T13:01:58Z

@kagawagao thanks for the head up :)
what would be the new syntax for that?

kagawagao · 2018-03-06T14:16:32Z

in the stack trace

DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead

I guess it should be

new NodeTemplatePlugin(outputOptions).apply(childCompiler)

jantimon · 2018-03-06T15:56:40Z

Thanks @kagawagao - it's released in 3.0.6

theodorejb · 2018-03-06T16:04:15Z

I'm still getting the following warning in v3.0.6:

(node:10052) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead

Edit: maybe it's coming from the html-webpack-include-assets-plugin module instead of this one?

alhazmy13 · 2018-03-06T21:43:29Z

Yes, still I the issue exist with version 3.0.6

(node:93696) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
TypeError: cb is not a function
    at Promise (eval at create (/xxx/node_modules/tapable/lib/HookCodeFactory.js:51:12), <anonymous>:11:16)
    at new Promise (<anonymous>)
    at AsyncSeriesWaterfallHook.eval [as promise] (eval at create (/xxx/node_modules/tapable/lib/HookCodeFactory.js:51:12), <anonymous>:4:8)
    at AsyncSeriesWaterfallHook.lazyCompileHook [as _promise] (/xxx/node_modules/tapable/lib/Hook.js:35:21)
    at /xxx/node_modules/html-webpack-plugin/index.js:647:47
    at Promise.resolve.then.then.then.then.then.then.then.then.catch.then.then (/xxx/node_modules/html-webpack-plugin/index.js:211:21)
    at <anonymous>

qazbnm456 · 2018-03-07T05:26:17Z

@theodorejb @alhazmy13 You may find out where the root cause is by setting process.traceDeprecation = true; in your webpack config or something. Then, you'll be able to see what line triggers the warning.

@alhazmy13 BTW, I noticed you're using electron-vue right? So, the warning actually comes from electron-vue's dev-runner.js. It's not html-webpack-plugin's fault. You can fix the code by conforming to the new API system, e.g.

compiler.hooks.compilation.tap('dev-runner', compilation => {
  compilation.hooks.htmlWebpackPluginAfterEmit.tapAsync('dev-runner', (data, cb) => {
    hotMiddleware.publish({ action: 'reload' })
    cb()
  })
}))

FYI, there're several lines of code need to be revised as well.

alhazmy13 · 2018-03-07T14:33:55Z

@qazbnm456 Thanks for your support, solved with your code.

gaterking · 2018-04-03T14:27:34Z

@jantimon I dont't think it has been fixed. In version 3.2.0, same error is showed.
cb is not a function …… at Promise (eval at create (*******\node_modules\html-webpack-plugin\node_modules\tapable\lib\HookCodeFactory.js:51:12), <anonymous>:11:16)

jantimon · 2018-04-03T19:57:38Z

@gaterking please create a new issue with a minimal reproduction example
and a stacktrace (please use process.traceDeprecation = true)

gaterking · 2018-04-08T02:03:47Z

@jantimon
It's my fault, I forget to update html-webpack-plugin-after-emit to webpack 4.

compiler.hooks.compilation.tap('html-webpack-plugin-after-emit', () => {  
        hotMiddleware.publish({  
              action: 'reload'  
        });  
     });

In webpack 3 code:

 compiler.plugin('compilation', (compilation) => {
        compilation.plugin('html-webpack-plugin-after-emit', (data, cb) => {
            hotMiddleware.publish({
                action: 'reload'
            });
            // cb();
        });
    });

lock · 2018-05-31T08:17:44Z

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

jantimon added a commit that referenced this issue Mar 6, 2018

fix(hooks): Remove deprecated tapable calls #879

0ebd57d

jantimon added a commit that referenced this issue Mar 6, 2018

fix(hooks): Remove deprecated tapable calls #879

2288f20

jantimon closed this as completed Mar 6, 2018

Gisleburt mentioned this issue Mar 6, 2018

Can't load plugins using webpack 4 #887

Closed

jantimon reopened this Mar 6, 2018

jantimon added a commit that referenced this issue Mar 6, 2018

fix(hooks): Call tapable.apply directly #879

200aa85

jantimon added a commit that referenced this issue Mar 6, 2018

fix(hooks): Call tapable.apply directly #879

bcbb036

jantimon closed this as completed Mar 6, 2018

renovate bot mentioned this issue Mar 21, 2018

Update html-webpack-plugin to 3.2.0-abandoned sbardian/DebtTrackerAPI#10

Closed

lock bot locked as resolved and limited conversation to collaborators May 31, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead #879

DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead #879

alhazmy13 commented Mar 4, 2018

kagawagao commented Mar 5, 2018

andriijas commented Mar 5, 2018

Gisleburt commented Mar 5, 2018

jantimon commented Mar 6, 2018

Gisleburt commented Mar 6, 2018

kagawagao commented Mar 6, 2018

jantimon commented Mar 6, 2018 •

edited

Loading

kagawagao commented Mar 6, 2018

jantimon commented Mar 6, 2018

theodorejb commented Mar 6, 2018 •

edited

Loading

alhazmy13 commented Mar 6, 2018

qazbnm456 commented Mar 7, 2018

alhazmy13 commented Mar 7, 2018

gaterking commented Apr 3, 2018 •

edited

Loading

jantimon commented Apr 3, 2018 •

edited

Loading

gaterking commented Apr 8, 2018 •

edited

Loading

lock bot commented May 31, 2018

DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead #879

DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead #879

Comments

alhazmy13 commented Mar 4, 2018

Error Message & Stack Trace

Config

Environment

kagawagao commented Mar 5, 2018

andriijas commented Mar 5, 2018

Gisleburt commented Mar 5, 2018

jantimon commented Mar 6, 2018

Gisleburt commented Mar 6, 2018

kagawagao commented Mar 6, 2018

jantimon commented Mar 6, 2018 • edited Loading

kagawagao commented Mar 6, 2018

jantimon commented Mar 6, 2018

theodorejb commented Mar 6, 2018 • edited Loading

alhazmy13 commented Mar 6, 2018

qazbnm456 commented Mar 7, 2018

alhazmy13 commented Mar 7, 2018

gaterking commented Apr 3, 2018 • edited Loading

jantimon commented Apr 3, 2018 • edited Loading

gaterking commented Apr 8, 2018 • edited Loading

lock bot commented May 31, 2018

DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead #879

DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead #879

jantimon commented Mar 6, 2018 •

edited

Loading

theodorejb commented Mar 6, 2018 •

edited

Loading

gaterking commented Apr 3, 2018 •

edited

Loading

jantimon commented Apr 3, 2018 •

edited

Loading

gaterking commented Apr 8, 2018 •

edited

Loading