'Create React App fails when "Starting the development server"

My react application is built using create react app https://reactjs.org/docs/create-a-new-react-app.html fails to start.

When i exec npm run start my application hangs with the following message.

Starting the development server...

package.json

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@types/jest": "^25.1.1",
    "@types/node": "^13.7.0",
    "@types/react": "^16.9.19",
    "@types/react-dom": "^16.9.5",
    "@types/react-router-dom": "^5.1.3",
    "axios": "^0.19.2",
    "lodash": "^4.17.15",
    "node-sass": "^4.13.1",
    "npm-check-updates": "^4.0.1",
    "qs": "^6.9.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.1",
    "typescript": "^3.7.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@semantic-release/gitlab": "^6.0.2",
    "semantic-release": "^17.0.2"
  },
  "release": {
    "branch": "master",
    "plugins": [
      "@semantic-release/commit-analyzer",
      "@semantic-release/release-notes-generator",
      [
        "@semantic-release/gitlab",
        {
          "gitlabUrl": "https://git.companyname.com"
        }
      ]
    ]
  }
}

Node Version: v12.14.1 Npm Version: 6.13.4

I have tried this a few times and each time it fails it is creating a new node process i know this because it asks me to select a different port.

So far i have attempted the following process without any luck

rm -rf node_modules
npm install
npm start

reactjs create-react-app

Solution 1:^[1]

For me it turned out restarting my computer fixed it.

I still don't know the cause of this as the environment has remained the same and apart from removing node_modules and npm install i did nothing else.

Solution 2:^[2]

If you have installed some packages yourself after creating react application using creat-react-app, it may be because, one of the installed packages is not working. In the past, I had a problem like your case. At that time, I have installed react-pdf package to show pdfs. As a consequence, development server didn't start and whenever I run again it asked to choose another port. After removing that package, it worked well.

So I think there may be not working module in the package.json. In my opinion, it may be 'qs' packagae.

Solution 3:^[3]

I copied your package.json file and ran it locally on my machine.

First I ran npm install

I then created /src/index.js and chucked in the following default code from create-react-app:

import React from "react";
import ReactDOM from "react-dom";

ReactDOM.render(<div>We're in!</div>, document.getElementById("root"));

And I also created /public/index.html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="logo192.png" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

Lastly, I ran npm start

The application ran fine, with the only concern being an out of date sub-dependency (Old version of corejs)

This leads me to think that the problem might be in your local setup.

I would recommend clearing your npm cache and trying again.

To clear your cache, run npm cache clear --f with elevated permissions.

My suggestion would then be to start a new app directory, just in case there's something corrupt in the existing directory.

Solution 4:^[4]

I fixed it by installing a previous version of npm-scripts Try using this:

npm install [email protected]

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Kay
Solution 2	Joe
Solution 3	Tim
Solution 4	Tayyab Ferozi

'Create React App fails when "Starting the development server"

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]

Solution 4:^[4]