为什么我的 React App 没有在 localhost 上加载？

Question

I've been working on with React for a while, successfully using npm start to view how my application is running.

At some point, my app stopped loading at http://localhost:3000/ .

I get this in the terminal:

Compiled successfully!

You can now view contact-list in the browser.

  Local:            http://localhost:3000
  On Your Network:  http://192.168.1.16:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

In my Chrome browser, it looks like it's just perpetually loading, showing no errors. Nothing is showing up in the console.

I tried deleting the browser cache.

I tried checking http://192.168.1.16:3000 . It also just perpetually loaded.

I tried another project on the same port and it worked, so it doesn't seem like an issue with the port.

Here is my package.json:

{
  "name": "contact-list",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.10",
    "@testing-library/react": "^11.2.6",
    "@testing-library/user-event": "^12.8.3",
    "bootstrap": "^5.1.3",
    "react": "^18.1.0",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.3.0",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.1.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Does anyone know what could be going wrong?

Answer 1

Not enough data. But one of the reasons could be that at some point port 3000 was not released correctly. Try to kill the process by port, or simply reboot the system