Webpack 热重载不重载

Question

我有这些配置：

.common.js

const path = require("path");

module.exports = {
  entry: {
    index: "./src/scripts/index.ts",
    library: "./src/scripts/library.ts",
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js"],
  },
  module: {
    rules: [
      {
        test: /\.ts?$/,
        use: "ts-loader",
        exclude: /node_modules/,
      },
      {
        test: /\.html$/i,
        loader: "html-loader",
      },
    ],
  },
};

.dev.js

const path = require("path");
const common = require("./webpack.common.js");
const { merge } = require("webpack-merge");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { HotModuleReplacementPlugin } = require("webpack");

module.exports = merge(common, {
  output: {
    filename: "[name].bundle.js",
    path: path.resolve(__dirname, "dev"),
  },
  module: {
    rules: [
      {
        test: /\.scss$/i,
        use: ["style-loader", "css-loader", "sass-loader"],
      },
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./src/index.html",
    }),
    new HotModuleReplacementPlugin(),
  ],
  mode: "development",
  devServer: {
    compress: true,
    hot: true,
    open: true,
    port: 9000,
  },
});

index.ts

import { Potato } from "./potato";
import "./styles.scss";

const potato = new Potato();

console.log(potato.getColor());
console.log(potato.getSize());
console.log("test");

declare const module: any; // without this, ts can't be transpiled, since module.hot doesn't exist
if (module.hot) {
  console.log("hot"); //this gets logged
  module.hot.accept();
}

土豆.ts

export class Potato {
  private color: string;
  private size: number;
  constructor() {
    this.color = "blue";
    this.size = 123;
  }
  public getColor() {
    return this.color;
  }
  public getSize() {
    return this.size;
  }
}

到目前为止，在我启动服务器后，它会打开一个新选项卡。当我在 index.ts 中更改某些内容时，它会记录“热”，之后它不会重新加载或更改任何内容（使用 console.logs 测试）。我也收到了这个警告（是的，一团糟）：

[HMR] Update failed: Loading hot update chunk index failed.
(missing: http://localhost:9000/index.e33a832f0f738968166e.hot-update.js)
loadUpdateChunk/<@http://localhost:9000/index.bundle.js:1011:26
loadUpdateChunk@http://localhost:9000/index.bundle.js:1006:20
__webpack_require__.hmrC.jsonp/<@http://localhost:9000/index.bundle.js:1466:29
__webpack_require__.hmrC.jsonp@http://localhost:9000/index.bundle.js:1461:22
hotCheck/</<@http://localhost:9000/index.bundle.js:844:45
hotCheck/<@http://localhost:9000/index.bundle.js:840:53
promise callback*hotCheck@http://localhost:9000/index.bundle.js:827:47
check@webpack://webpack-example/./node_modules/webpack/hot/dev-server.js?:14:5
@webpack://webpack-example/./node_modules/webpack/hot/dev-server.js?:55:4
emit@webpack://webpack-example/./node_modules/events/events.js?:153:17
reloadApp@webpack://webpack-example/./node_modules/webpack-dev-server/client/utils/reloadApp.js?:23:16
ok@webpack://webpack-example/./node_modules/webpack-dev-server/client/index.js?:120:14
initSocket/<@webpack://webpack-example/./node_modules/webpack-dev-server/client/socket.js?:48:25
onMessage/this.sock.onmessage@webpack://webpack-example/./node_modules/webpack-dev-server/client/clients/SockJSClient.js?:67:10
[5]</EventTarget.prototype.dispatchEvent@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:170:20
[14]</</SockJS.prototype._transportMessage/<@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:891:16
[14]</</SockJS.prototype._transportMessage@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:889:17
[3]</EventEmitter.prototype.emit@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:86:18
WebSocketTransport/this.ws.onmessage@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:2965:10
EventHandlerNonNull*WebSocketTransport@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:2963:3
[14]</</SockJS.prototype._connect@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:832:24
[14]</</SockJS.prototype._receiveInfo@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:806:8
g@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:66:16
[3]</EventEmitter.prototype.emit@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:86:18
[12]</</InfoReceiver.prototype.doXhr/<@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:567:10
g@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:66:16
[3]</EventEmitter.prototype.emit@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:86:18
InfoAjax/<@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:374:10
g@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:66:16
[3]</EventEmitter.prototype.emit@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:86:18
[17]</</AbstractXHRObject.prototype._start/this.xhr.onreadystatechange@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:1601:14
EventHandlerNonNull*[17]</</AbstractXHRObject.prototype._start@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:1560:3
AbstractXHRObject/<@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:1498:10
setTimeout handler*AbstractXHRObject@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:1497:13
XHRLocalObject@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:2918:13
InfoAjax@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:356:13
[12]</</InfoReceiver._getReceiver@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:536:12
[12]</</InfoReceiver.prototype.doXhr@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:556:26
InfoReceiver/<@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:525:10
setTimeout handler*InfoReceiver@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:524:13
SockJS@webpack://webpack-example/./node_modules/sockjs-client/dist/sockjs.js?:734:14
SockJSClient@webpack://webpack-example/./node_modules/webpack-dev-server/client/clients/SockJSClient.js?:43:18
initSocket@webpack://webpack-example/./node_modules/webpack-dev-server/client/socket.js?:21:12
@webpack://webpack-example/./node_modules/webpack-dev-server/client/index.js?:177:7
./node_modules/webpack-dev-server/client/index.js?http://localhost:9000@http://localhost:9000/index.bundle.js:291:1
__webpack_require__@http://localhost:9000/index.bundle.js:447:33
@http://localhost:9000/index.bundle.js:1505:30
@http://localhost:9000/index.bundle.js:1508:12

我已经打开了一个 issue on GitHub