Webpack导入行为

Question

我目前正在使用webpack，并且在我的应用程序初始化之前添加了这段代码。

delete window.IntersectionObserver;

if (!('IntersectionObserver' in window)) {
    console.log(`Load observer`);
    import('/node_modules/intersection-observer/intersection-observer.js');
    console.log(`Loaded`);
}

console.log(`Start`);

我删除IntersectionObserver只是为了测试目的。

但是当我运行代码时，我得到了类似Load observer -> Loaded -> Start的日志

但据我所知，import返回一个promise，这意味着应该是异步的，或者这是我不熟悉的一些不同的行为？

我在等Load observer -> Start -> Loaded呢。

Answer 1

如果您想等待promise -您应该将第二个console.log放在then()子句中，如下所示

delete window.IntersectionObserver;

if (!('IntersectionObserver' in window)) {
    console.log(`Load observer`);
    import('/node_modules/intersection-observer/intersection-observer.js').then(module => console.log(`Loaded`));
}

console.log(`Start`);

或者像这样使用async/await

(async () =>
{
delete window.IntersectionObserver;

if (!('IntersectionObserver' in window)) {
    console.log(`Load observer`);
    await import('/node_modules/intersection-observer/intersection-observer.js');
    console.log(`Loaded`);
}

console.log(`Start`);
})();