webpack - HMR - 接受多个依赖项

Question

HMR API 的 webpack 文档提到了以下方法:

accept(dependencies: string[], callback: (updatedDependencies) => void) => void

我了解如何接受单个依赖项，但不确定多个依赖项的回调应该是什么样子。

这是我的代码:

 var $ = require('jquery')
 var page = require('page')
 var index = require('./index')
 var home = require('./home')

 $(function() {
   page('/', index)
   page('/home', home)
   page()

   if (module.hot) {
     module.hot.accept(['./index', './home'], function(updatedDependencies) {
       // what should I put in here?
     })
   }
 })

Answer 1

尝试回答这个问题，因为没有其他人尝试过。

从查看您的代码来看，它看起来不错。

回调方法在多个依赖项被接受后运行。
您基本上发送一个函数作为参数，然后一旦接受了所有依赖项，就会执行该函数。

所以你几乎可以在这个函数中放入任何你喜欢的东西。例如:

if (module.hot) {
    module.hot.accept(['./index', './home'], function() {
        alert('all the dependencies have been accepted');
        console.log('all the dependencies have been accepted');
    });
};

在该示例中，一旦 accept 方法运行并完成，它将执行回调函数，在这种情况下，它会发送警报并将消息记录到控制台。

简而言之，替换“//我应该在这里放什么？”使用您想要继续的代码，一旦依赖项被接受。

我在您的回调中看到您有一个参数“updatedDependencies”，您可以调试并在回调方法的第一行放置一个断点，然后将鼠标放在“updatedDependencies”参数上以查看它是否包含任何内容 - 如果包含，您显然可以相应地处理该数据。

希望这可以帮助。