javascript 延迟模块加载在ES6中如何工作

zbdgwd5y 于 2023-04-19 发布在 Java

关注(0)|答案(3)|浏览(156)

我怎么能 lazily-load ES6模块？lazy 的意思是我不想实际加载**不需要的模块。例如，我可以用RequireJS做一些事情：

function someEventHandler() {
    var SomeModule = require('some-module'),
        module = new SomeModule();
    // ...
}

使用ES6导入似乎不可能实现相同的功能：

// Doesn't appear to be valid...
function someEventHandler() {
    import SomeModule from 'some-module';
    var module = new SomeModule();
    // ...
}

是否有任何可行的技术可以只在需要的时候使用ES6模块来拉取依赖关系？或者是跟踪完整依赖关系图并预先获取所有内容的唯一途径？

JavaScript

来源：https://stackoverflow.com/questions/30033152/how-does-lazy-module-loading-work-in-es6

3条答案

按热度按时间

kcrjzv8t1#

import语句只在文件的最顶端工作，它将加载所有文件。这主要是为了避免循环依赖的潜在问题。
也会有一种方法来做异步加载;然而，规范似乎还没有最终确定。ES6 module loader polyfill包使用了一个名为System.import(moduleName)的方法，该方法返回一个promise，最终规范可能看起来类似：

function someEventHandler() {
    System.import('some-module').then((SomeModule) => {
        var module = new SomeModule();
        // ...
    })
}

赞(0）回复(0）举报 2023-04-19

zsbz8rwp2#

ES6中的lazyloading jQuery示例：

import('jquery').then((jquery) => {
     // Because jquery is the module, here is the new syntax for using this 
          window.$ = jquery.default;
          window.$('#id');
});