在本地主机中保存更改后，React 组件不会在浏览器中重新加载

Question

我使用 Create-React-App 创建了一个新的 React 项目。在旧项目中，每当我在组件中进行更改并保存组件时，它都会反映在浏览器中，但在新项目中，当我保存代码中的更改时，浏览器不会重新加载，也不会反映更改。所以我停止了正在运行的进程并再次给出npm start

这是我的 package.json 文件。

{
  "name": "new-application",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.4.0",
    "@testing-library/user-event": "^7.2.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-redux": "^7.1.3",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.0",
    "redux": "^4.0.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": {
    "redux-devtools": "^3.5.0",
    "webpack": "^4.41.5"
  }
}

我可以在 package.json 中添加一些内容，以便在进行更改时自动重新加载浏览器吗？

Answer 1

我遇到了类似（或事件相同）的问题，我通过添加以下标志更改了 package.json 文件中的启动命令： --watch --watch-poll 到 webpack-dev-server：

{
//...
"scripts": {
    "start": "webpack-dev-server --env.ENVIRONMENT=development --content-base src/ --mode development --watch --watch-poll",
    // ...
}
// ...
}

现在，使用 npm start 然后更改 src 文件，我可以在浏览器中看到更改。

请在此处https://webpack.js.org/configuration/watch/了解更多选项。