浜松のWEBシステム開発・スマートフォンアプリ開発・RTK-GNSS関連の開発はお任せください
株式会社シーポイントラボ
TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:静岡県浜松市中区富塚町1933-1 佐鳴湖パークタウンサウス2F

【create-react-app】npm run ejectコマンドがエラーになる時の対処法

以前に投稿した、「【Cordova】create-react-appコマンドでCordovaアプリの開発環境を作る」という記事で、簡単に Cordova + React の開発環境を用意する方法を紹介しましたが、今日この記事をもとに、別アプリを作成しようとしたところエラーが発生して詰みかけたので、その対処方法についてです。

create-react-app の GitHub ページはこちらから。

GitHub – facebook/create-react-app: Set up a modern web app by running one command.
https://github.com/facebook/create-react-app

 

実行手順は下記のとおりです。

create-react-app [プロジェクト名]
cd [プロジェクト名]
npm run eject

上記コマンドの 3つ目の npm run eject でエラーが発生しておりました。
ちなみにこちらのコマンドは、作成したプロジェクトの react-scripts をディレクトリに展開することができます。
こちらをすることで、自分で 1からプロジェクトを用意したのと同じ状態になるため、今後の開発がスムーズになります。
また、万が一 create-react-app に何かがあった場合でも、大きな影響なく、引き続き開発を行うことができます。

そんな便利なコマンドが使えなくなり、何度もプロジェクトの削除・再追加を行って試行錯誤を繰り返したところ…判明した原因は create-react-app のバージョンでした。
現状より大分古いバージョンを使っていたので、一度 create-react-app をアンインストールした後、再インストールして最新バージョンを入れ直しました。
コマンドは下記です。

npm uninstall -g create-react-app
npm install -g create-react-app

なお、場合によってはアップデートしても古いバージョンのまま!ということがありますので、その時は、「【Windows】npmがアップデートできない時の対処法」の記事をご参考にしてください。

C:\Program Files (x86)\Nodist\bin

上記ディレクトリ内にある create-react-app と名のつくファイルのどれかのバージョンが古いことが影響していると思います。
もし、それが見つかったらそのファイルをリネームしてから、create-react-app のバージョンを再確認してみてください。
私の環境では、こちらの作業で解決できました。

上記を実行し、問題なく最新バージョンの create-react-app が追加出来たら、一旦プロジェクトを削除してから、再度新規作成してください。
恐らく作成中に表示されるログも変わっているはずです。
そして、作成後 npm run eject コマンドを実行したところ…問題なくディレクトリを展開できました!
やっと開発に進める!

 

以上、create-react-app で作成したプロジェクトで npm run eject コマンドがエラーになる時の対処法でした。
ご参考になれば幸いです。

  • この記事いいね! (0)