ES6的模块暴露与模块引入

ES6的模块暴露和引入可以让我们实现模块化编程，以下列出ES6的几种模块暴露与引入的方式与区别。

1、ES6一共有三种模块暴露方法

• 多行暴露

模块1：module1.js

//多行暴露
export function foo() {
    console,console.log('foo() moudle1');
}

export function bar() {
    console.log('bar() moudle1')
}

• 统一暴露

模块2： module2.js

function fun1() {
    console.log('fun1() module2')
}

function fun2() {
    console.log('fun2() module2')
}
// 统一暴露
export {foo,bar}

以上两种向外暴露方式在主文件引入时必须使用对象的解构赋值引用（不能使用变量接收的方式来映入）
主模块：main.js

import {foo,bar} from '.js/src/module1.js'
import {fun1,fun2} from './js/src/module2.js'

• 默认暴露

export default {
    foo() {
        console.log('默认暴露方式')
    },
    bar() {
        console.log('默认暴露')
    }
}

默认暴露的方式只允许有一个: export default {}且在主模块引入时可以使用定义变量来接收的方式！

// 引入模块3
import module3 from '.js/src/module3.js'

// 使用模块
module3.foo()
module3.bar()

转载于:https://www.cnblogs.com/yuanchao-blog/p/10985884.html