tar*_*ing 5 typescript webpack
是否可以import()在ES6 / Typescript 中的动态语句中使用完整的URL ？
import('https://foo.com/mymodule.js').then(() => {
console.log('mymodule is loaded');
});
我得到一个错误
//Cannot find module 'https://foo.com/mymodule.js'.
使用Webpack和Typescript，我们已经成功地使用了动态导入的相对路径
import(/* webpackChunkName: "mymodule" */ '../mymodule');
因此看来Webpack已经在运行时加载了模块。
Tur*_*rbo 10
没有捆绑器的纯 ES6 模块
现在大多数浏览器都原生支持 ES6 模块。您需要type="module"在脚本标签中定义。
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script type="module">
import camelCase from "http://localhost:40080/camelCase.js";
import * as systemX from "https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.21.4/system.js";
console.log(systemX);
console.log(camelCase);
</script>
</head>
<body>
<h1>Hello</h1>
</body>
</html>
或者，您也可以链接到文件。
<!-- move all previoous code to main.js -->
<script type="module" src="./main.js"></script>
进一步阅读：
https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/
网页包
我测试了下面的技巧并且它有效。
import(/* webpackIgnore: true */ 'http://example.com/some-module/some-module.bundle.js').then(module => console.log(module.default));
https://github.com/webpack/webpack/issues/8341#issuecomment-436550381
**请注意，对于这两种用例，网络服务器都必须允许 CORS。
ES2020引入了一种新的类似函数的导入语法，即所谓的“动态导入”，允许动态导入 JavaScript 模块。导入过程的精确实现留给主机（例如浏览器或 Node.js），但现代 Web 浏览器确实使用此语法通过 HTTP 实现动态加载，使用 URL 标识模块：
// foo.js at example.com
export function foo() {
return 'this is foo'
}
// bar.js, running in the client
const { foo } = await import('http://example.com/my-module.js')
foo() // "this is foo"
请注意，您需要牢记 CORS 和 MIME 类型的约束。这和那是相关的。
ES 模块不保证既不支持静态import也不支持动态URL import()。当前浏览器版本（基于 Chrome、Firefox、Safari）支持静态和动态 URL import，实现依赖于 CORS 机制并且可能会有所不同。Node.js 仅通过自定义 ESM 加载器支持此功能，出于安全考虑，将来默认情况下不太可能允许此功能。
可以通过第三方插件处理 Webpack 中的 HTTP 传输。
SystemJS 可以处理脚本加载：
System.config({
paths: {
'mymodule': 'https://example.com/mymodule.js'
}
});
System.import('mymodule')
.then(mymodule => {
...
})
.catch(error => console.error(error));
或者：
System.import('https://example.com/mymodule.js')
.then(mymodule => {
...
})
.catch(error => console.error(error));
SystemJS 还提供在必要时处理加载脚本的功能，例如在这些脚本中处理模块的方式。
| 归档时间： |
|
| 查看次数： |
2711 次 |
| 最近记录： |