先做个前提,新建三个模块JS文件m1,m2,m3,其中m1.js 为分别暴露,m2.js 为统一暴露,m3.js 为默认暴露。接下来进行文件的import引入
1.通用的引入方式,这种方式适合任何暴露方式的引入
1 import * as m1 from './modulesJs/m1.js' 2 import * as m2 from './modulesJs/m2.js' 3 import * as m3 from './modulesJs/m3.js'
只不过调用的时候,默认暴露的m3.js对应引入的m3在调用属性方法的时候多一个default节点。假如调用m3中的say()方法,需要这样去调用 m3.default.say()
2.解构赋值的方式进行引入
1 // 分别暴露和统一暴露的引入方式没有差异: 2 import {team,play} from './modulesJs/m1.js' 3 play() // this is a team of LPL 4 import { name, dis as d } from './modulesJs/m2.js' 5 d() // we are the champion 6 7 // 默认暴露的解构赋值引入有一定差异,如下 8 import { default as m3 } from './modulesJs/m3.js' // 此处的default 不能够单独使用,需要取别名 9 // 这样引入的方式在调用的时候就没有多default节点了,可以直接进行对象属性的调用 10 m3.say() // it is a good team
3.简便形式 只针对默认暴露
1 import m3 from './modulesJs/m3.js'
2 m3.say() // 同样也可以直接进行调用 输出结果:it is a good team