sh: webpack: command not found

Question

前提・実現したいこと

ついこの間まで正常にbuildできていたのに急に以下のようなエラーが出ました。
webpackのインストールのやり直しなど試しましたが、効果はないようです。
わかる方がいましたらコメントお願いします。

発生している問題・エラーメッセージ

(base) ~/Documents/react $ npm run watch

> @ watch /Users/ユーザ名/Documents/react
> webpack --watch

sh: webpack: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! @ watch: `webpack --watch`
npm ERR! spawn ENOENT
npm ERR! 
npm ERR! Failed at the @ watch script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/ユーザ名/.npm/_logs/2020-05-06T05_44_31_025Z-debug.log

該当のソースコード

package.json

{
  "private": true,
  "license": "ISC",
  "author": "Josh Ruff",
  "scripts": {
    "clean": "rm -rf dist",
    "watch": "webpack --watch",
    "build": "webpack"
  },
  "dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-google-login": "^5.1.10",
    "react-hook-form": "^5.5.1",
    "react-router": "^5.1.2",
    "react-router-dom": "^5.1.2",
    "react-swipeable-views": "^0.13.9",
    "styled-components": "^5.0.1"
  },
  "devDependencies": {
    "@babel/core": "^7.4.0",
    "@babel/plugin-proposal-class-properties": "^7.0.0",
    "@babel/plugin-proposal-export-namespace-from": "^7.0.0",
    "@babel/plugin-proposal-throw-expressions": "^7.0.0",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/preset-env": "^7.0.0-beta.51",
    "@babel/preset-react": "^7.0.0-beta.51",
    "babel-eslint": "^10.1.0",
    "babel-loader": "^8.0.0-beta.0",
    "css-loader": "^3.0.0",
    "eslint": "^6.8.0",
    "eslint-config-airbnb": "^18.1.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-prettier": "^3.1.3",
    "eslint-plugin-react": "^7.19.0",
    "eslint-plugin-react-hooks": "^2.5.1",
    "node-sass": "^4.8.3",
    "prettier": "^2.0.5",
    "sass-loader": "^7.0.3",
    "style-loader": "^0.21.0",
    "webpack": "^4.12.0",
    "webpack-cli": "^3.3.0"
  }
}

Comments

[rubytomato]

package.jsonの内容を見ると、バンドルは npm run watch ではないかと思いますが、このコマンドを実行するとどうなりますか？
それと、webpack/webpack-cliの再インストールというのはローカルでしょうか？それともグローバルでしょうか？

[aiai8976]

npm run watchの結果をエラーの部分に掲載しているつもりです。
また、webpack-cliはローカルに再インストールしました。

[rubytomato]

> npm run watchの結果をエラーの部分に掲載しているつもりです。
失礼いたしました。

それでは、npxがインストールされていれば

npx webpack --version
npx webpack-cli --version

npxがインストールされていなければ

.\node_modules\.bin\webpack --version
.\node_modules\.bin\webpack-cli --version

でバージョンは確認できますか？

バージョンが確認できたら

npx webpack --watch
もしくは
.\node_modules\.bin\webpack --watch

の実行結果はどうでしょうか？

Answer 1

以下でいけました。

#グローバルにインストールし直す
npm install -g webpack
npm install -g webpack-cli

#node_modulesでエラーが出たら
rm -r node_modules
npm i

Answer 2

sh: webpack: command not found

webpackが見つからない、というエラーですが、
node_modules/.bin/　にwebpackはありますか？

$ ls -l node_modules/.bin/*

lrwxr-xr-x  1 ユーザ名 wheel  25  5  6 15:22 webpack -> ../webpack/bin/webpack.js*
lrwxr-xr-x  1 ユーザ名 wheel  25  5  6 15:29 webpack-cli -> ../webpack-cli/bin/cli.js*