浅析exports和module.exports的理解以及对module.exports、exports、export都是导出的区别
一、内部原理
exports = module.exports = {}
exports 是 module.exports 的引用，怎么理解这句话呢？大概就是 var a = {}; var b = a; a 和 b 之间的关系吧。
1、require：在文件中 require 实际引入的是 module.exports 里面返回的东西
2、module：module 实际上是一个对象，里面有很多属性，包括 exports 等。
为什么可以直接打印 module，而不会报错呢？—— 因为当每个文件被执行的时候，内部都会执行 var module = new Module() 实例被创建。
3、module.exports：给module实例中的exports对象添加的属性或者方法；
4、exports：直接打印 exports 是个空对象，且不会报错。因为内部执行了 var module = new Module(); var exports = module.exports
5、示例分析：
（1）正确示例：可以看到实例对象module中的exports对象中新增了add 方法和name属性
console.log(module);
module.exports.add = function (x, y) { return x + y };
exports.name = name;
console.log(module);
（2）错误示例1：重新改变module.exports的指向之后，exports.xxx 添加属性无效
因为exports指向的还是之前的旧对象，exports.xxx 是往之前指向的对象中添加属性，但是module.exports所指向的是一个新的对象，所以实例对象中的exports对象只有add方法，name属性没有添加进去；
console.log(module);
module.exports = {
add: function(x,y) { return x + y }
}
exports.name = 'tom';
console.log(module);
（3）错误示例2：重新改变exports的指向之后，exports.xxx添加属性无效
因为require的原理就是引入module.exports里返回的内容，可以用exports添加属性和方法，是由于内部添加了一条exports = module.exports的引用，让exports指向了module.exports，所以更改exports的指向之后，就不会对module.exports中的内容有任何的影响了。
console.log(module);
module.exports.add = function (x, y) { return x + y };
exports = { name: 'tom'};
console.log(module);
二、exports 与 module.exports 使用
1、将函数直接导出成模块
// 模块文件：./my_modules/m.js
function fn1(){
console.log('我是fn1')
}
module.exports=fn1;
// index.js
var foo=require('./my_modules/m')
foo(); // 我是fn1
2、如果模块文件中有两个函数，第二个会覆盖第一个
function fn1(){
console.log('我是fn1')
}
function fn2(){
console.log('我是fn2')
}
module.exports=fn1;
module.exports=fn2;
// index.js
var foo=require('./my_modules/m')
foo();//我是fn2
3、如何导出模块中的所有函数
......
module.exports.fn1=fn1;
module.exports.fn2=fn2;
var foo=require('./my_modules/m')
foo.fn1();//我是fn1
foo.fn2();//我是fn2
4、exports 是 module.exports 的一个引用，exports = module.exports = {}
exports.xxx 相当于在导出对象上挂属性，该属性对调用模块直接可见
// 模块文件：./my_modules/m.js
exports.fn1=function(){
console.log('我是fn1')
}
exports.fn2=function(){
console.log('我是fn2')
}
// index.js
var foo=require('./my_modules/m')
foo.fn1();//我是fn1
foo.fn2();//我是fn2
5、小结区别：
（1）module.exports=xxx，相当于导出某个函数或对象等内容，在另一个文件中引用后可直接使用
（2）exports.xxx 和 module.exports.xxx 相当于把函数或变量挂载在对象上，在另一个文件中应用后，通过调用对象属性和方法进行使用。
（3）exports 是 module.exports 的一个引用，exports = module.exports = {}
三、module.exports、exports、export都是导出，有何区别？
这三个东西其实是两个概念的区分： 先来看一个表格：
| 规范名称 | 导出关键词 | 导入关键词 | 重命名变量 | 集体导出 |
|---|---|---|---|---|
| commonjs | module.exports / exports | require | {A ：B } | 不支持 |
| esm | export | import | as | * as xxx |
这样看其实还是挺清晰的，不同规范使用的关键词和特性不同而已，我们在使用这些关键词的时候区分自己是什么环境下写的代码
nodejs（webpack，babel）-> commonjs
浏览器（vue的script标签 或 html 中带type="module"的script标签中）-> esm
module.exports、exports是一伙的，他们都是基于commonjs规范来的
export是基于es6的esm(ECMA Script Modules)规范来的
1、CommonJS 规范是为了解决 JavaScript 的作用域问题而定义的模块形式，可以使每个模块它自身的命名空间中执行。该规范的主要内容是，模块必须通过 module.exports 导出对外的变量或接口，通过 require() 来导入其他模块的输出到当前模块作用域中。
2、esm（ECMA Script Modules）规范：esm 是将 javascript 程序拆分成多个单独模块，并能按需导入的标准。和webpack，babel不同的是，esm 是 javascript 的标准功能，在浏览器端和 nodejs 中都已得到实现。使用 esm 的好处是浏览器可以最优化加载模块，比使用库更有效率。通过import, export语法实现模块变量的导入和导出
3、划重点：commonjs中使用require 和 modelue.exports实现模块的导入导出，esm 使用 import, export导入导出。
