ES modules的导出方式

Named Exports

// module1.js
export const name = 'Ben';

// app.js
import { name } from './module1.js'
console.log(name);
// Ben

// module1.js
const name = 'Ben';
export { name };

// app.js
import { name } from './module1.js'
console.log(name);
// Ben

通过观察上面的代码我们发现，该方式导出的模块内容，必须用解构的方式访问，也就是无法直接用module1.name这样的方式访问。

Default Exports

Default Exports的导出方式，刚好可以补充Named Exports的对象访问方式。

// module1.js
const name = 'Ben';
export default {
    name
};

// app.js
import module1 from './module1.js'
console.log(module1.name);
// Ben

其它

对于Named Exports的导出方式，如果非要使用对象的访问方式，则可以使用* as xxx语法，将模块中所有Named Exports导出的数据合并为一个对象，来达到目的。

// module1.js
export const name = 'Ben';

// app.js
import * as obj from './module1.js'
console.log(obj.name);
// Ben