前端模块化
看到tsconfig.json文件里的module编译选项想到的，发现自己有点迷糊
从ts默认配置的commonjs规范开始
// 定义模块math.js
var basicNum = 0;
function add(a, b) {
return a + b;
}
module.exports = { //在这里写上需要向外暴露的函数、变量
add: add,
basicNum: basicNum
}
// 引用自定义的模块时，参数包含路径，可省略.js
var math = require('./math');
math.add(2, 5);
// 引用核心模块时，不需要带路径
var http = require('http');
http.createService(...).listen(3000);
总的来说用module.exports = {你要暴露的对象或方法}
在想用的时候用require('xx路径')，这时对应模块的exports对象会暴露给你，你可以随便赋给一个值方便以后调用，看了文章说的是暴露的对象为深拷贝对象，对其修改不会改变原模块
接下来是ES6提供的模块化
/** 定义模块 math.js **/
var basicNum = 0;
var add = function (a, b) {
return a + b;
};
export { basicNum, add };
/** 引用模块 **/
import { basicNum, add } from './math';
function test(ele) {
ele.textContent = add(99 + basicNum);
}
这种方式在引入时要确定引入的变量或者方法名，我们还可以通过一下方式来默认导出
/** export default **/
//定义输出
export default { basicNum, add };
//引入
import math from './math';
function test(ele) {
ele.textContent = math.add(99 + math.basicNum);
}
这时我们在使用模块的时候可以不考虑导入具体的模块，而导入整个模块文件，但是现在大环境下已经不推荐这么做了，更加推荐按需导入，减少代码体积，防止被叼
