javascript - webpack-dev-server 热重载无法运行的可能原因是什么？

Question

在我的 React 项目中，当我运行命令“npm start”或“yarn start”并将 webpack-dev-server 配置为使用热重载(--hot 标志)时，我遇到以下错误:[错误消息这里]。您能帮我解决这个问题吗？

我的文件结构:

package.json:

  {
    "name": "reactapp",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
        "start": "webpack-dev-server --hot"
    },
    "author": "Sheharzad",
    "license": "ISC",
    "dependencies": {
        "babel-core": "^6.26.3",
        "babel-loader": "^7.1.5",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-react": "^6.24.1",
        "react": "^16.4.2",
        "react-dom": "^16.4.2",
        "webpack": "^4.17.1",
        "webpack-dev-server": "^3.1.6"
    }
  }

App.jsx:

import React from 'react';

class App extends React.Component {
   render() {
      return (
         <div>
            Hello World!!!
         </div>
      );
   }
}
export default App;

ma​​in.js:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.jsx';

ReactDOM.render(<App />, document.getElementById('app'));

Answer 1

听着，您还没有添加接受 --hot 标志的 webpack cli 包。添加这个包后尝试一下。它应该有效。如果没有帮助，请告诉我。

编辑: “start”:“webpack-dev-server --modedevelopment--config webpack.config.js --open --hot:

确保根文件夹中有 webpack 配置并重新启动开发服务器。