[Q&A] webpack-cliのエラー解決

webpack-cliのエラー解決

解決したいこと

webpack-cliのエラー解決方法を知りたいです。

Ruby on Railsでポートフォリオを作っており、
herokuでデプロイする時にいつも起こるエラーです。

このエラーがでてもデプロイは完了しています。

発生している問題・エラー

remote:        warning " > webpack-cli@4.6.0" has unmet peer dependency "webpack@4.x.x || 5.x.x".
remote:        warning "webpack-cli > @webpack-cli/configtest@1.0.2" has unmet peer dependency "webpack@4.x.x || 5.x.x".
remote:        warning " > webpack-dev-server@3.11.2" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".

自分で試したこと

ターミナルで以下を実行

$ rails webpacker:install
$ RAILS_ENV=test bundle exec rails webpacker:compile

よろしくお願いします！！

2Answer

@yoshi389111 posted at 2021-04-11

お使いの webpack-cli は、 webpack の 4.x.x か 5.x.x のバージョンと合わせて使う前提なのに、それが入っていない、というエラーが出ています。

webpack を入れていないのか、別のバージョンを入れているのではないでしょうか？

あるいは、webpack がバージョンアップしてしまっているのに、 webpack-cli が古い（あるいは、メンテナンスが追い付いていない）というケースもあります。

0Like

Comments

@chibayuta-cp
Questioner
ありがとうございます！

Webpackのところをいじっていたらエラーがたくさんでたので対応します！

@chibayuta-cp posted at 2021-04-13

$ webpack -v
CLI for webpack must be installed.
  webpack-cli (https://github.com/webpack/webpack-cli)

We will use "yarn" to install the CLI via "yarn add -D webpack-cli".
yarn add v1.22.10stall 'webpack-cli' (yes/no): yes
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "linux" is incompatible with this module.
info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > webpack-dev-server@3.11.2" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > webpack-dev-middleware@3.7.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-cli > @webpack-cli/configtest@1.0.2" has unmet peer dependency "webpack@4.x.x || 5.x.x".
warning " > webpack-cli@4.6.0" has unmet peer dependency "webpack@4.x.x || 5.x.x".
[4/4] Building fresh packages...
success Saved 1 new dependency.
info Direct dependencies
└─ webpack-cli@4.6.0
info All dependencies
└─ webpack-cli@4.6.0
Done in 6.70s.
Error: Cannot find module 'webpack-cli/package.json'
Require stack:
- /home/chiba/.nodebrew/node/v14.16.0/lib/node_modules/webpack/bin/webpack.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.resolve (internal/modules/cjs/helpers.js:94:19)
    at runCli (/home/chiba/.nodebrew/node/v14.16.0/lib/node_modules/webpack/bin/webpack.js:50:26)
    at /home/chiba/.nodebrew/node/v14.16.0/lib/node_modules/webpack/bin/webpack.js:139:5
    at processTicksAndRejections (internal/process/task_queues.js:93:5) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/chiba/.nodebrew/node/v14.16.0/lib/node_modules/webpack/bin/webpack.js'
  ]
}

Webpackのバージョンを確認しようとすると、
webpack-cliのインストールが必要と表示され、
yesと入力してもエラーが発生して、webpack-cliのインストールがインストールされません。

どうすればいいのか教えていただきたいです！
よろしくお願いいたします！