結論
npm install を実行した後は「npm run dev」を再実行しましょう。
何があったか
React/Next.jsの勉強でもしてみようかと思い、本を購入。
本の通りインストールして。「npm run dev」で起動
無事にNext.jsの初期画面が表示された。
本の通り進めていくと
Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports.
てなエラー文が出現。
まったくわからん。
完全に雰囲気で作業してるし、エラー文の内容もよくわからん。
さっきまで出現してなかったエラー。
さっきまでやってた内容との違いを振り返る。
よくサイトのフッターにある、TwitterやFacebookのアイコンを表示させようとしてた。
こんな感じのアイコンね。
これはFont Awesomeってところの無料のアイコンを使用。
これを使用するにはFont Awesomeをインストールする必要があります。
インストールするために下記コマンドを実行(他にもfont awesome関連で必要なやついくつかインストールしたけど省略)
npm install @fortawesome/fontawesome-svg-core
インストール後に使用するから、ファイルでimportして読み込んで、設定してみる。
正常に表示された！アイコンの設定って簡単と思って喜んでました。
しかし、リロードして再表示すると最初のエラー文言が出現。
よくわからずめっちゃ調べた。そもそもReact自体ほぼ初めてやしエラー全く検討がつかん。
30分くらい調べてみて、ふと思いついた。
npm でインストールしたから再起動しなアカンのじゃね？と思い、試しに実行。
その結果エラーがなく正常に表示されましたとさ。
