I tried to run the Vuetify VueJS Cordova example but got this error after npm run dev
node build/dev-server.js
Starting dev server... (node:1024) DeprecationWarning: Tapable.plugin is deprecated. Use new API on
.hooks
instead (node:1024) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead
How to fix it? I already update all NPM packages, didn't help.
The deprecation message:
DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead
DeprecationWarning: Tapable.plugin is deprecated. Use new API on.hooks
instead
Is just a warning:
Here is a quick summary for everyone encountering this message.
What is this message?
webpack 4 is using a new plugin system and deprecates the previous APIs. There are 2 new warnings:
DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
These are warnings. They are outputted to the console to warn our users that they are using an outdated API and should migrate to the newest.
How bad are these warnings?
They are only a textual information, not errors. If you see a
DeprecationWarning
you can ignore it until you have to update to the next major version of webpack.
So there's nothing you have or should do about it.
Other than that, I trust you are receiving an error like:
/tmp/my-project> npm run dev
> [email protected] dev /tmp/my-project/my-project
> node build/dev-server.js
> Starting dev server...
(node:29408) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
(node:29408) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead
/tmp/my-project/node_modules/html-webpack-plugin/lib/compiler.js:81
var outputName = compilation.mainTemplate.applyPluginsWaterfall('asset-path', outputOptions.filename, {
^
TypeError: compilation.mainTemplate.applyPluginsWaterfall is not a function
at /tmp/my-project/node_modules/html-webpack-plugin/lib/compiler.js:81:51
at compile (/tmp/my-project/node_modules/webpack/lib/Compiler.js:242:11)
at hooks.afterCompile.callAsync.err (/tmp/my-project/node_modules/webpack/lib/Compiler.js:487:14)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/tmp/my-project/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:15:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/tmp/my-project/node_modules/tapable/lib/Hook.js:35:21)
at compilation.seal.err (/tmp/my-project/node_modules/webpack/lib/Compiler.js:484:30)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/tmp/my-project/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/tmp/my-project/node_modules/tapable/lib/Hook.js:35:21)
at hooks.optimizeAssets.callAsync.err (/tmp/my-project/node_modules/webpack/lib/Compilation.js:966:35)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/tmp/my-project/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/tmp/my-project/node_modules/tapable/lib/Hook.js:35:21)
at hooks.optimizeChunkAssets.callAsync.err (/tmp/my-project/node_modules/webpack/lib/Compilation.js:957:32)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/tmp/my-project/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/tmp/my-project/node_modules/tapable/lib/Hook.js:35:21)
at hooks.additionalAssets.callAsync.err (/tmp/my-project/node_modules/webpack/lib/Compilation.js:952:36)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/tmp/my-project/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `node build/dev-server.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
You should update your html-webpack-plugin
to the latest version:
npm install --save-dev html-webpack-plugin@3
And the error should go away.