Bootstrap

第十六章 TypeScript 模块解析

es6模块化规范用法之前

 - > Nodejs - exports

// 导入
require("xxx");
require("../xxx.js");
// 导出
exports.xxxxxx= function() {};
module.exports = xxxxx;

AMD ->   requireJs

// 定义
define("module", ["dep1", "dep2"], function(d1, d2) {...});
// 加载模块
require(["module", "../app"], function(module, app) {...});

CMD ->  seaJs

define(function(require, exports, module) {
  var a = require('./a');
  a.doSomething();
  
  var b = require('./b');
  b.doSomething();
});

UMD ->  UMD是AMD和CommonJS的糅合

(function (window, factory) {
    // 检测是不是 Nodejs 环境
	if (typeof module === 'object' && typeof module.exports === "objects") {
        module.exports = factory();
    } 
	// 检测是不是 AMD 规范
	else if (typeof define === 'function' && define.amd) {
        define(factory);
    } 
	// 使用浏览器环境
	else {
        window.eventUtil = factory();
    }
})(this, function () {
    //module ...
});
es6模块化规范用法
// 1. 默认导出 导出的东西可以是任何类型  一个模块只能出现一个默认导出
// export default 1

//使用方式 import 如果是默认导出名字随便起
// import xx from 'xx'

// 2. 分别导出
// export const a = 1
// export const b = (a:any,b:any):void =>{
// 	return
// }

//使用方法
// import obj,{ a,b } from "xxx"

// 3. 解构导出 支持别名 as
// export  {
// 	a,b,obj
// }

// import { a,b,obj } from "xxx"
// import { a,b as c,obj } from "xxx"

// 查看所有导出的内容
// import  * as xx from "xxx"

//4.动态引入
//import 只能在最上层使用.
// import('xxx') 返回的是一个Promise
// if(true){
// 	import('./index1').then((res)=>{
// 		console.log(res)
// 	})
// }

;