什么是UMD
所谓UMD (Universal Module Definition)
,就是一种javascript
通用模块定义规范,让你的模块能在javascript
所有运行环境中发挥作用。
什么是模块
模块最终是要导出一个对象,函数,或者变量
一个简单的模块
function factory() { return { name: '我是一个umd模块' } }
全局导出
(function(root, factory) { console.log('没有模块环境,直接挂载在全局对象上') root.umdModule = factory(); }(this, function() { return { name: '我是一个umd模块' } }))
这里的立即执行函数传入参数 this, this 可以是环境变量中的windows或者global,并将上面的模块挂载到全局上去
兼容所有风格
(function(root, factory) { if (typeof module === 'object' && typeof module.exports === 'object') { console.log('是commonjs模块规范,nodejs环境') var depModule = require('./umd-module-depended') module.exports = factory(depModule); } else if (typeof define === 'function' && define.amd) { console.log('是AMD模块规范,如require.js') define(['depModule'], factory) } else if (typeof define === 'function' && define.cmd) { console.log('是CMD模块规范,如sea.js') define(function(require, exports, module) { var depModule = require('depModule') module.exports = factory(depModule) }) } else { console.log('没有模块环境,直接挂载在全局对象上') root.umdModule = factory(root.depModule); } }(this, function(depModule) { console.log('我调用了依赖模块', depModule) return { name: '我自己是一个umd模块' } }))
TS的导入导出
class Earth{ name: string = 'earth'; rotation(){ let oneday: string = 'A rotation takes 24 hours.'; console.log(oneday); } } let human: string = 'Human being lives on Earth.'; export {Earth, human};
或者
export class Mars{ name: string = 'Mars'; status: string = 'China will explore Mars in the following several decades.'; } export function exploring(){ console.log('Launching Changzheng-5 rocket.'); console.log('Add oil, 胖五.'); }
导入
import {Earth, human} from './OnlyOneEarth' import {Mars, exploring} from './ExploringMars' let ourEarth: Earth = new Earth(); let mysteriousMars: Mars = new Mars(); console.log(human); console.log(mysteriousMars.status); ourEarth.rotation(); exploring();
Node 应用由模块组成,采用 CommonJS 模块规范
导出
var x = 5; var addX = function (value) { return value + x; }; module.exports.x = x; module.exports.addX = addX;
导入
var example = require('./example.js');
console.log(example.x); // 5
console.log(example.addX(1)); // 6