IT初学者部

プログラミングに関することを中心に、備忘録として残していきます。

create-react-appでエラー出たのでコンソールの出力通りに対応したら解消できた話

はじめに

Reactの記事書くのは初めてですかね。 vue.js使うことが多かったんですが、vue.js利用したアプリケーションは一つ作成しているので、原点に帰りreactを使っていこうと思います。

何が原点なんって話になるんですが、元々私自身は仕事でフロントエンド触るときはreactが中心でした。(たまにjqueryとか)

って感じだったので、仕事以外では他のフレームワーク、ライブラリでも使おうかなと思いVue.jsだのAngularだの使っていたわけです。

知らんがなって話かもしれませんが、そういう個人的事情でreactの開発はあまりやってこなかったんですが、久々にやってみようと思いまして、まずは環境構築!ってことで、早速取り掛かってみましょう。

普通にコマンド実行すれば勝手に作られますが

React + TypeScriptで開発していこうと思います。

そういうアプリケーションを作成するときは、以下のようなコマンドを実行してください。

npx create-react-app app-name --template typescript 

って感じでコマンドを実行します。(npmだとかnodeだとかはとっくにインストールされている前提です、ごめんなさい…)

これ実行すると色々進んでいって、最後に「Happy Hacking!」と出れば成功です、が…

こんな感じのメッセージが出力されました。

You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.1).

We no longer support global installation of Create React App.

Please remove any global installs with one of the following commands:
- npm uninstall -g create-react-app
- yarn global remove create-react-app

The latest instructions for creating a new app can be found here:
https://create-react-app.dev/docs/getting-started/

グローバルインストールのサポートをしていないため、コマンドを実行してcreate-react-appをアンインストールしてから再度実行してくださいみたいなこと書いてあると思います。

とりあえず指示に従って実行してみましょう。

npm uninstall -g create-react-app

実行すると普通に関連するパッケージなどがアンインストールされます。

アンインストール後、再度以下のコマンドを実行しましょう。

npx create-react-app app-name --template typescript 

同意を求められるのでyを押してください。

処理が開始されます。あとは自動でインストール、作成が行われていきます。

一通り終わるとこんな感じのメッセージが出てきます。

(切り取り方ちょっとミスりました)

以上で、create-react-appで「You are running create-react-app 4.0.3, which is behind the latest release (5.0.1).」的なエラーが出たときの対処法終了です。

おわりに

まあ対処法も何も、基本的にコンソールに出力されるメッセージを読んでその通りに処理を進めることで対応可能です。メッセージちゃんと読むのって大切なんだなあ…(当たり前)