如何使用webpack-dev-server设置create-react-app

Question

我正在尝试使用webpack-dev-server设置我的create-react-app实例。

这是我的package.json文件

{
  "name": "reactgs",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-scripts": "1.0.14"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "webpack-dev-server --entry ./node_modules/react-scripts/bin/react-scripts.js --output-filename ./dist/bundle.js --inline --progress",
  },
  "devDependencies": {
    "webpack-dev-server": "^2.9.1"
  }
}

我没有webpack.config.js文件。

当我跑步

npm run build

输出显示为

以下行运行正常。

npm start

我也可以在同一台机器上针对不同项目的webpack设置很好。

有谁知道如何为create-react-app正确配置webpack？

Answer 1

npm start开箱即用。 它将使用webpack-dev-server --hot本身托管您的应用程序。 您只需要挂钩HMR代码即可告诉webpack观看并重新加载所需的内容。

这个GitHub对话提供了一个非常不错的简单解决方案，用于在有和没有Redux的情况下挂钩HMR（ https://github.com/facebookincubator/create-react-app/issues/2317 ）。