Question

我正在开展reactjs项目并使用webpack-dev-server来运行我的应用。

每当我更改一些js文件时，

react-hot都没有刷新我的浏览器。此外，刷新浏览器时，不会显示更改。我必须关闭webpack-dev-server。这是我的package.json文件：

{
  "name": "someApp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --hot --inline",
    "prod": "webpack -p"
  },
  "author": "someName",
  "license": "ISC",
  "dependencies": {
    "axios": "^0.15.3",
    "react": "^15.4.1",
    "react-addons-css-transition-group": "^15.4.1",
    "react-dom": "^15.4.1",
    "react-router": "^3.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.4.5",
    "babel-loader": "^6.2.1",
    "babel-preset-react": "^6.3.13",
    "css-loader": "^0.26.1",
    "html-webpack-plugin": "^2.7.1",
    "react-hot-loader": "^1.3.1",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.11",
    "webpack-dev-server": "^1.16.2"
  }
}

这是我的webpack.config.js配置：

var HtmlWebpackPlugin = require('html-webpack-plugin')
var HTMLWebpackPluginConfig = new HtmlWebpackPlugin({
  template: __dirname + '/app/index.html',
  filename: 'index.html',
  inject: 'body'
});

module.exports = {
  entry: [
    './app/index.js'
  ],
  output: {
    path: __dirname + '/dist',
    filename: "index_bundle.js"
  },
  module: {
    loaders: [
      {test: /\.js$/, include: __dirname + '/app', loaders: ["react-hot", "babel-loader"]},
      { test: /\.css$/, loader: "style-loader!css-loader" }
    ]
  },
  plugins: [HTMLWebpackPluginConfig]
};

Answer 1

您在entry文件的webpack.config.js部分错过了此部分：

entry: [ 'webpack-dev-server/client?http://0.0.0.0:3000', 'webpack/hot/only-dev-server', ]

ReactJS - webpack-dev-server不热刷我的文件

1 个答案: