急にyarn startができなくて困ったので原因と経緯を書いておきます。
結果を先に言うとreact-scripts
を消してしまっていました…
発生した事象
$ yarn start
yarn run v1.22.5
$ react-scripts start
/bin/sh: react-scripts: command not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
発生の経緯
久々に触ったアプリにて、
package installひとつづつやるのめんどくさいから、package.json一気に書き換えて…
よしyarn installして、とりあえずエラー出てないか起動してみよう....あれ?そもそも起動ができない…なぜだ…
解決までの道筋
初めてみたエラーだ…なんだこれ…パニック…
とかなる前にまずはエラーメッセージを出してくれているのでちゃんと読む。
/bin/sh: react-scripts: command not found
yarn曰く、原因はreact-scriptsがないですよ?と言っている。
あ…なるほど…
これはどういうことか
$ yarn start
をした時に見ているのは
(...省略)
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
(省略...)
この部分。
ここでreact-scripts
呼んでいるのにそんなもの見つかりませんよ?正気ですか?と言われている。
なるほど?ではreact-scripts
はnode_modules/
にいるはず(と思っている)ので調べる。
$ ls node_modules/ | grep react-scripts
$
あれ…ない?
$ ls -1 node_modules/ | grep react-
babel-plugin-add-react-displayname
babel-plugin-react-docgen
babel-plugin-transform-react-remove-prop-types
babel-preset-react-app
connected-react-router
create-react-context
css-to-react-native
enzyme-adapter-react-16
eslint-config-react-app
eslint-plugin-react-hooks
hoist-non-react-statics
mini-create-react-context
react-addons-create-fragment
react-app-polyfill
react-async-script
react-circle
react-clientside-effect
react-color
react-dev-utils
react-div-100vh
react-docgen
react-dom
react-draggable
react-dropzone
react-element-to-jsx-string
react-error-overlay
react-fast-compare
react-focus-lock
react-ga
react-google-recaptcha
react-gtm-module
react-helmet
react-helmet-async
react-hot-loader
react-hotkeys
react-infinite-scroller
react-input-autosize
react-inspector
react-is
react-lifecycles-compat
react-move
react-native-get-random-values
react-popper
react-popper-tooltip
react-pose
react-redux
react-router
react-router-dom
react-router-hash-link
react-scroll
react-select
react-side-effect
react-sizeme
react-syntax-highlighter
react-test-renderer
react-textarea-autosize
react-transition-group
react-use
storybook-react-router
やっぱりない…
package.jsonを見に行くと…react-scripts
が消えている…
解決
ということでpackage.json
にreact-scripts
を追記して、yarn-install
して解決。
まとめ
ちゃんとエラーメッセージで教えてくれているので、
初めてみるエラーだからってパニックになってはいけない。
…あとエラーハンドリングする時は、
エラー対応した人がわかるようにエラーメッセンジャー作るの重要ですね。
気をつけます。