web-dev-qa-db-ja.com

DeprecationWarning:Tapable.pluginは非推奨です。代わりに、 `.hooks`で新しいAPIを使用してください

Vuetify VueJS Cordova example を実行しようとしましたが、npm run devの後にこのエラーが発生しました

node build/dev-server.js

Devサーバーを開始しています...(node:1024)非推奨警告:Tapable.pluginは非推奨です。代わりに.hooksで新しいAPIを使用してください(ノード:1024)非推奨警告:Tapable.applyは非推奨です。代わりに直接プラグインに適用を呼び出します

修正方法は?すでにすべてのNPMパッケージを更新していますが、助けにはなりませんでした。

17
Tom

非推奨メッセージ:

DeprecationWarning:Tapable.applyは非推奨です。代わりに直接プラグインに適用を呼び出します
非推奨警告:Tapable.pluginは非推奨です。代わりに.hooksで新しいAPIを使用してください

警告のみ

以下は、このメッセージに遭遇したすべての人のための簡単な要約です。

このメッセージは何ですか?

webpack 4は新しいプラグインシステムを使用しており、以前のAPIを廃止します。 2つの新しい警告があります。

DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead
DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead

これらは警告です。これらは、古いAPIを使用しているため最新のものに移行する必要があることをユーザーに警告するためにコンソールに出力されます。

これらの警告はどのようにbadですか?

それらは単なるテキスト情報であり、エラーではありません。 DeprecationWarningが表示される場合、次のメジャーバージョンのwebpackに更新する必要があるまで、それを無視できます

ですから、あなたが持っていることやするべきことは何もありません。


それ以外は、次のようなエラーが表示されると確信しています。

/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.

html-webpack-plugin最新バージョン に更新する必要があります。

npm install --save-dev html-webpack-plugin@3

そして、エラーは消えるはずです。

18
acdcjunior

まだ古いプラグインAPIを使用しているため、Webpack 4でこの警告が発生する可能性のあるプラグインがいくつかあります。最新バージョンにアップグレードする必要があります。警告の原因となっているプラ​​グインを見つけるには、これをwebpack構成ファイルの一番上に置きます。

process.traceDeprecation = true

次のような詳細なスタックトレースが表示されます。

 (node:10213) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
   at FriendlyErrorsWebpackPlugin.apply (./node_modules/friendly-errors-webpack-plugin/src/friendly-errors-plugin.js:39:14)
   at webpack (./node_modules/webpack/lib/webpack.js:37:12)
   at processOptions (./node_modules/webpack-cli/bin/webpack.js:436:16)
   at <anonymous>
   at process._tickCallback (internal/process/next_tick.js:160:7)
   at Function.Module.runMain (module.js:703:11)
   at startup (bootstrap_node.js:193:16)
   at bootstrap_node.js:617:3

この場合、friendly-errors-webpack-pluginが警告の原因であることを意味します。

または、--trace-deprecationフラグを追加してノードプロセスを実行できます。

どのプラグインが警告を引き起こしているのかを見つけたら、パッケージマネージャーを使用してアップグレードします。警告は消えます。

yarn upgrade friendly-errors-webpack-plugin

このような非推奨の警告を完全に抑制したくない場合(推奨しません)、process.noDeprecation = trueを使用します

これは私が問題をすばやく見つけるのに役立ちました。他の人の助けになることを願っています。

11
Maikel Ruiz

私は同じ問題に直面していました。このコマンドを使用して解決:-

npm install --save-dev extract-text-webpack-plugin @ next

NPM 6.4.1
Node 10.9.0
Webpack 4.22.0 
4
Nidhi

私の場合、廃止通知はwebpack-md5-hashパッケージによって発生しました。

0
John Kennedy

私の場合、問題はwebpack-cleanup-pluginにありました。このプラグインをclean-self-webpack-pluginに置き換えて修正しました。

Webpack-dev-serverを2回実行しようとしたときにこの問題が発生しました。1つは1つのターミナルで実行し、もう1つは別のターミナルで実行しようとしました。 1つだけ実行すると問題が解決しました。

0
hsintuit