Javascript 使用动态导入的方式是什么? 我正在尝试使用动态导入-import()
我读过这个 看了这个, 但仍然找不到正确的方法 错误: 未捕获(承诺中)引用错误:未定义模块 样板: 我已经创建了一个新项目 没有网页,没有任务运行程序。 仅使用包含以下文件的节点包运行服务器:Javascript 使用动态导入的方式是什么? 我正在尝试使用动态导入-import(),javascript,html,dynamic-import,Javascript,Html,Dynamic Import,我读过这个 看了这个, 但仍然找不到正确的方法 错误: 未捕获(承诺中)引用错误:未定义模块 样板: 我已经创建了一个新项目 没有网页,没有任务运行程序。 仅使用包含以下文件的节点包运行服务器: index.html index.js a.js index.html: <button id="btn"> Lazy load a module</button> <script src="index.js"></script> const btn =
<button id="btn"> Lazy load a module</button>
<script src="index.js"></script>
const btn = document.querySelector('#btn');
btn.addEventListener('click', event => {
import('./a.js').then(module => { console.log(module) })
});
a.js
这里缺少什么?动态导入功能来自ECMAScript标准,而
模块。导出是commonjs加载程序的一部分(如browserify)
要实现这一点,您需要在任何地方使用ES模块语法:
index.html:将type=“module”
添加到条目文件
<button id="btn"> Lazy load a module</button>
<script src="index.js" type="module"></script>
需要注意的是,浏览器中的模块解析方法与任何其他资源(指向html文件、图像等的链接)的解析方法相同。谢谢,它起作用了:)我的惰性模块是a.js,那么为什么我需要将type=module添加到index.js?浏览器需要知道如何将第一个文件视为ES模块,然后,它可以从其他ES模块导入符号
<button id="btn"> Lazy load a module</button>
<script src="index.js" type="module"></script>
export const type = 'LazyModule';