javascript - 您何时不应该接受webpack Hot Module Reloading？

因此，对于webpack，仅当您在模块中或模块的父级中包含以下代码时，HMR才起作用:

if (module.hot) {
  module.hot.accept()
}

这使我想知道为什么您会一开始拒绝HMR。使用它会产生性能成本或其他负面影响吗？

docs在这个问题上不太清楚。

最佳答案

您只能在代码中使用HMR

是无状态的(例如CSS)或

提供了清理旧状态

的准备

由于大多数代码不是无状态的，因此需要进行一些额外的工作。实现此目的的常用方法是用代理替换导出的函数(react-hot-loader的工作方式与此类似)。因此，有可能在不更新其他依赖项的情况下替换代理后面的实际实现。

例如，想象一下这个( buggy )模块:

function add(a, b) {
    return a - b;
}

export add;

注意到该错误之后，您不能随便换掉add函数，因为其他模块拥有对该函数的引用。这就是为什么需要包装输出函数的代理:

function _add(a, b) {
    return a - b;
}

export function add(a, b) {
    return _add(a, b);
};

现在，您可以轻松换出_add，而无需更新其他模块。这对函数很好用，但对其他类型(如导出的对象，数字，字符串)则无效。但是，使用ES2015 proxies，可以导出在所有类型上都像代理一样工作的占位符。

因此，HMR的挑战是您需要用新代码替换旧代码，而又不离开任何怪异状态。而且，以通用方式仍然很难做到。