module not found: error: can't resolve 'react'

エラー

module not found: error: can't resolve 'react'

　'react'モジュールそのものの例がネットに載ってなかったので、苦労しました。

解決方法

yarn add styled-components

　これで解決しました。もう消えてしまったので分からないですが、エラーの後に「styled-componentsに対しての話ですよ」とか書いてあったのかも。。。

参考（package.json）

　上記の解決方法を思いついたきっかけは、動いてるreactアプリのpackage.jsonと見比べたことでした。
　reactアプリが動いた時のpackeage.jsonを載せておきます。差分があるかを見てみると、解決の糸口が見えてくれるかも！

package.json

{
  "name": "todo-app",
  "private": true,
  "dependencies": {
    "@babel/preset-react": "^7.22.5",
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "5.4.4",
    "axios": "^1.5.0",
    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
    "prop-types": "^15.8.1",
    "react": "^17.0.1",
    "react-dom": "^17.0.2",
    "react-icons": "^4.10.1",
    "react-router-dom": "^5.3.4",
    "styled-components": "^6.0.7",
    "turbolinks": "^5.2.0",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12"
  },
  "version": "0.1.0",
  "devDependencies": {
    "@babel/plugin-proposal-private-methods": "^7.18.6",
    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
    "react-toastify": "^9.1.3",
    "webpack-dev-server": "^3"
  }
}

package.jsonって何？

　インストールすべきパッケージのバーションが書いてます。
yarn add パッケージで追加できます。
　※手動ではなく、コマンド経由で更新します。

package-lock.jsonって何？

　実際にインストールしたパッケージのバージョンが書いてます。
　package.json　　　：予定
　package-lock.json：実際
　　という違いがあります。

node_modulesって何？

　package.jsonを基にインストールしたパッケージがいっぱいあります。
　量が多いので、.gitignoreに指定されます（githubにアップロードされません）。