对esm模块import理解
// 模块a.js export let a = 1; export function addA() { a++; } // index.js import { a, addA } from './a.js'; console.log('a=', a); // 1 addA(); console.log('a=', a); // 2 // other.js import { a, addA } from './a.js'; console.log('a=', a); // 2 addA(); console.log('a=', a); // 3
index.js这里的
impot { a, addA } from './a.js';
和commonJs引入写法的:
const{ a, addA } = require('./a.js');
不同,commonJs的{a, addA}是解构赋值,而esm的{a, addA},是把a.js的引用变量(index.js类似导出了指针&a)添加进index.js中了。
但是有一个问题:在index.js或者other.js中是不能手动直接修改变量a的(类似修改一个const变量),只能通过引入暴露出的addA来修改。
chrome 60+版本已经支持esm。