vue の webpack -v エラー解決の概要

XiaobaiはVueについて学び、次にwebpackについて学び、そしてさまざまなものをインストールしました

cnpm は国産ソースなので海外ソースよりはるかに高速です。cnpm について知らない方は自分で調べてみてください。

cnpm インストール -g webpack

しばらくするとインストールが成功し、webpackのバージョンを確認したい

webpack-cliをインストールするように促されるので、インストールします

cnpm インストール -g webpack-cli

しばらくするとインストールされます。再度 webpack -v で見ると、以下のエラーが報告されます。

$ ウェブパック -v
C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\lib\groups\resolveConfig.js:105
        await (constresolvedOption of finalizedConfigs) {
            ^^^^^
構文エラー: 予期しない予約語
    NativeCompileCache._moduleCompile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\[email protected]@v8-compile-cache\v8-compile-cache.js:240:18) で
    Module._compile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\[email protected]@v8-compile-cache\v8-compile-cache.js:184:36) で
    Object.Module._extensions..js (module.js:664:10) で
    Module.load (module.js:566:32) で
    tryModuleLoad (module.js:506:12) で
    Function.Module._load (module.js:498:3) で
    Module.require (module.js:597:17) で
    要求時 (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\[email protected]@v8-compile-cache\v8-compile-cache.js:159:20)
    オブジェクト <anonymous> (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\lib\webpack-cli.js:14:32)
    Module._compile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\[email protected]@v8-compile-cache\v8-compile-cache.js:192:30) で

インストールされているパッケージを確認するには、npm list --depth=0 -g を使用します。
私もさまざまなバージョンを印刷しましたが、2 つのエラーが報告され、長年の経験を持つプログラマーとして非常に残念に思いました。

$ npm リスト --depth=0 -g
C:\Users\Administrator\AppData\Roaming\npm
6.1.1 より前のバージョン
+-- [email protected]
+-- [email protected]
[email protected] より前のバージョン

npm ERR! C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@[email protected]@@webpack-cli でエラーが発生しました: ENOENT: そのようなファイルまたはディレクトリはありません。'C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@[email protected]@@webpack-cli\package.json' を開いてください
npm ERR! C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@[email protected]@@webpack-cli でエラーが発生しました: ENOENT: そのようなファイルまたはディレクトリはありません。'C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@[email protected]@@webpack-cli\package.json' を開いてください

そこでよく見てみると、package.json ファイルが欠落していたので、新規作成したところ、読み込めないとエラーが報告されました。当然、中身が空っぽだと読み込めません。ファイルのないパスを求められる別のディレクトリにファイルがあったので、この階層にコピーして各パッケージのバージョンを確認してみました。エラーは出ませんでしたが、webpack -v はやはり機能せず、上記エラーが報告されました。webpack と webpack-cli のバージョンが一致していないのが問題なのではないかと思います。

バージョンコマンドを確認します:

cnpm で Webpack のバージョンを表示する

印刷されたバージョンが多すぎてここにはリストできません。確認したところ、私のコンピューター上のバージョンは 4.19.0 で、最新バージョンは 5.4.0 であることがわかりました。

cnpm で webpack-cli のバージョンを表示する

webpack-cli の最新バージョンは 4.2.0 です。

おそらくバージョンの非対称性が原因です。

次に、webpack-cli をアンインストールして再度インストールします。

cnpm アンインストール weabpack-cli

「0.029 秒で最新になりました」とだけ出力され、あまり役に立ちません。npm list --depth=0 -g を使用して、[email protected] がまだ存在することを確認します。

次に、webpack-cliの指定されたバージョンをインストールする方法を調べました

今見たものの古いバージョンを見つけてください。

cnpm インストール -g [email protected]

インストールが成功した後

npm list --depth=0 -g を確認すると、印刷は正常で、エラーは報告されません。

$ npm リスト --depth=0 -g
C:\Users\Administrator\AppData\Roaming\npm
6.1.1 より前のバージョン
+-- [email protected]
+-- [email protected]
[email protected] より

その後、webpack -vを再度使用すると、エラーは報告されず、正常に表示されます。

$ ウェブパック -v
4.19.0

今のところピットクライミングは成功しています〜

昔、node.jsのバージョンによって落とし穴が多いという記事を読みました。npmで管理されているツールのバージョンも同様です。まだ学習もしていないのに、せっかくの学習が無駄になりそうです。プログラマーの道はこんなにも険しいのか！！！

これで、vue の webpack -v エラーの解決方法の概要に関するこの記事は終了です。vue の webpack -v エラーに関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: