3

我环顾四周，但无法得到我在 stackoverflow 上看到的任何答案。

我无法使用 webpack 或 webpack dev-server 的命令行；我仅限于使用 Node API。

下面是我如何使用 webpack。

webpack.config.js

module.exports = {
  entry: [
    'webpack-dev-server/client?http://localhost:3000',
    // i've also tried webpack/hot/dev-server here
    'webpack/hot/only-dev-server',
    path.join(__dirname, 'src', 'js', 'app.jsx')
  ],
  output: {
    path: path.join(__dirname, 'dist', 'js'),
    filename: 'script.js',
    publicPath: '/dist/'
  },
  module: {
    loaders: [{
      test: /\.(js|jsx)$/,
      loaders: ['react-hot', 'babel']
    }]
  },
  plugins: []
};

包含在 gulp 任务“开始”中

gulp.task('start', function (callback) {
  var config = Object.create(require('webpack.config.js'));
  config.plugins.push(new webpack.HotModuleReplacementPlugin());

  var devServer = new webpackDevServer(webpack(config), {
    stats: { colors: true },
    contentBase: path.resolve(__dirname, 'dist'),
    progress: true,
    inline: true,
    hot: true
  });
});

我的期望

当我运行 gulp start 时，我希望 webpack 开发服务器启动，允许我访问 localhost:3000/。这应该从我的项目的 /dist/ 文件夹中加载一个 index.html。到目前为止，一切都很好。我希望当我对文件（例如 app.jsx）进行更改时，更改将会出现。

实际发生了什么

我收到错误“[HMR] Hot Module Replacement is disabled”，没有进一步的解释。

任何帮助，将不胜感激。我一直试图让热重装工作一整天。

4

2 回答 2

1

在插件部分的 webpack.config.js 中试试这个，

plugins: [new webpack.HotModuleReplacementPlugin()]

我知道您在 gulp 任务中推送插件，但您必须--hot --inline在 cli 或 npm 脚本上使用

于 2016-09-09T02:09:01.993 回答
1

尝试像 webpack-dev-server --hot --inline在 packge.json 中一样运行 webpack，不知何故官方文档现在是错误的。

于 2017-10-26T09:23:38.690 回答