NEW ARTICLE
Google Colaboratory コマンドパレットを開くショートカットキー
  1. HOME
  2. React
  3. React.js エラー「npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! projectname@0.1.0 start: react-scripts start」が発生した場合の対応方法

React.js エラー「npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! projectname@0.1.0 start: react-scripts start」が発生した場合の対応方法

React.js エラー「npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! projectname@0.1.0 start: react-scripts start」が発生した場合の対応方法

npm start実行時に発生。原因はハッキリとはわかりませんが、再現はできたので対処法を記述してます。

目次

環境

  • OS  CentOS Linux release 8.0.1905 (Core)
  • node V13.11.0
  • npm 6.14.3
  • React 16.13.0

react.js環境構築

create-react-appで構築してます。

エラー全文

npm start

<出力結果>
> projectname@0.1.0 start /home/user/projectname
> react-scripts start

require(...) is not a function
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! projectname@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the projectname@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/user/.npm/_logs/debug.log

原因

調べてみると「http-proxy-middleware」をインストール後に、npm start実行時に発生。

http-proxy-middlewareをインストール

npm i http-proxy-middleware

setupProxy.jsを下記の内容で記述

const proxy = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(proxy("/api/v1/version", { target: "https://192.168.xxx.xxx:8080" }));
  a
};

npm start実行すると、エラーが発生する

対応方法

モジュールを削除して、再度インストール前に、http-proxy-middlewareを使用しなけけばエラーは発生しなくなる

package.jsonから「”http-proxy-middleware”: “^1.0.3”,」を削除します。

変更前

　"version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "axios": "^0.19.2",
　　"http-proxy-middleware": "^1.0.3",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "^3.4.1"
  },

変更後

　"version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "axios": "^0.19.2",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "^3.4.1"
  },

node_modulesとpackage-lock.json削除してcacheも削除に再度インストールすれば、エラーは発生しなくなりました。

rm -rf node_modules && rm ./package-lock.json && npm cache clean --force && npm install

どうも、create-react-app時に「node_modules」内には「http-proxy-middleware」が入っているので、それが原因だった気がします。