使用TypeScript编译器选项“module”的模块加载顺序不正确：“es2015”

Question

我们正在使用带有awesome-typescript-loader 3.4.1的WebPack 3.10.0（TS版本为2.6.2）。相关摘要：

const win = <any>window;

...

console.log('jQuery before', {import: jQuery, win$: win.$, winJQuery: win.jQuery});

import * as jQuery from 'jquery';

win.jQuery = win.$ = jQuery;
console.log('jQuery after', {import: jQuery, win$: win.$, winJQuery: win.jQuery});

...

import 'bootstrap';

在实际代码中，加载jQuery和Bootstrap之间有几行。如果没有这些行，Bootstrap将无法启动（将虚拟的tether和popper实例放在窗口对象上以免浪费带宽，因为我们没有使用Bootstrap使用这些库的任何东西）。

“module”：“commonjs”

Bootstrap启动正常，日志包含预期结果：

jQuery before {import: undefined, win$: undefined, winJQuery: undefined}
jQuery after {import: ƒ, win$: ƒ, winJQuery: ƒ}

“module”：“es2015”

Bootstrap崩溃：

Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript.

删除Bootstrap导入后，将生成以下日志：

jQuery before {import: ƒ, win$: undefined, winJQuery: undefined}
jQuery after {import: ƒ, win$: ƒ, winJQuery: ƒ}

请注意，jQuery导入是从“future”打印出来的，因为在运行“jQuery before”时它应该尚未导入。

问题

我怀疑es2015中的进口是悬挂的，当只为副作用进口时没有多大意义。

在使用"module": "es2015"时，如何使导入遵守它们在代码中的顺序？

或者，如果这是不可能的，有没有其他方法可以推迟加载某些模块（例如Bootstrap），直到代码执行，所以我可以设置模块所期望的适当环境？

Answer 1

如果您想延迟加载模块，可以使用require（＆＃39;＆＃39;），这不会被提升