Webpack - [HMR]熱模塊更換已禁用

Question

我環顧四周，但無法得到我在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 dev服務器能夠啟動，允許我點擊localhost：3000 /。 這應該從我的項目的/ dist /文件夾中加載index.html。 到現在為止還挺好。 我希望當我對文件（例如，app.jsx）進行更改時，會發生更改。

實際發生了什么

我收到錯誤“[HMR]熱模塊更換已禁用”，沒有進一步說明。

任何幫助，將不勝感激。 我一直試圖讓熱重裝工作一整天。

Answer 1

在插件部分的webpack.config.js中試試這個，

plugins: [new webpack.HotModuleReplacementPlugin()]

我知道你正在推動你的--hot --inline任務中的插件，但你必須在cli或你的npm腳本上使用--hot --inline

Answer 2

嘗試在packpack.json中運行webpack作為webpack-dev-server --hot --inline ，現在某個官方文檔是錯誤的。