首先如果想用export模块化,需要npm init
执行之后,会多出来一个pakcage.json文件,这时候如果你还无法模块化,那就看看这个文件里有没有type:module,没有就加上
关于npm init的其他作用可以看这篇
https://www.cnblogs.com/wangxirui/p/13399315.html
然后普通的export
导出
引入1
然后export default
而export default
export default的出现是因为,export导出的话,引入的时候需要知道要引入的变量名或函数名,才能引入; export {a} ; import {a} from ‘.’ 必须得知道叫a,还要看文档自己去看….不太方便
但是export default 是把export default后面的内容全盘脱出,外部随意定义变量即可引入export default {a} ; import hhh from ‘.’ 就可以直接hhh.a
导出
引入1
引入2
export 与export derault其实是等同的,见这篇博客
https://www.cnblogs.com/fanyanzhao/p/10298543.html
这篇文章也不错
https://www.cnblogs.com/my466879168/p/12526782.html
// modules.js
function add(x, y) {
return x * y;
}
export {add as default};
// 等同于
// export default add;
// app.js
import { default as foo } from 'modules';
// 等同于
// import foo from 'modules';另外有一个值得一提的比较
就是export 导出的只能是标识符,而export default 导出的可以不是标识符
就像这样
let a = 1 export {a} 而不能说是像这样 export{ a:1}
export default {a:1}可以这样
有个非常浅显的东西，我这里说一下
其实就是说，一个js模块里面可以导出很多东西，比如组件，函数什么的，但是无论外面组件或者函数用过多少次，js模块里其他没导出的代码，你引用了几个js模块几次，就执行几次
一般来说，都只会引入一次，然后多次使用其中的组件和函数，所以其中没导出的代码也就只执行一次