同时兼容 AMD， CommandJS 和全局变量的模块化定义的一个通用实现

最近围观了一下UMD，发现虽然不错，但是其实并不是非常通用，所以自己尝试折腾了一个来玩玩，发现还不错，就拿来给大家围观一下。水平渣渣，请轻拍。

先不废话，先看个实例。一共是三个文件，example.js、lib1.js和lib2.js。其中example.js依赖lib1.js和lib2.js，同时也就是意味着example模块依赖lib1模块和lib2模块。

-
|-example.js
|-lib1.js
|-lib2.js

首先，来看看example.js。如下所示,example.js定义一个example模块输出"example"，并且调用lib1()和lib2()，依赖当前目录下的lib1模块和lib2模块。

//example.js
(function (r, n, d, f) {
  if (typeof define === 'function' && define.amd)
    define(n, d, f);
  else if (typeof exports === 'object')
    module.exports = f.apply(r, d.map(function(m){return require(m)}));
  else
    r[n] = f.apply(r, d.map(function(m){return r[m]}));
}(this, 'example', ['./lib1', './lib2'], function (lib1, lib2) {

  var myFunc = function myFunc(){
    console.log('example');
    lib1();
    lib2();
  };

  return myFunc;
}));

接下来是lib1.js和lib2.js。下面是lib1.js的代码，定义一个lib1模块输出"lib1"，没有依赖。lib2.js的代码一样，定义一个lib2模块，输出"lib2"。

// lib1.js
(function (r, n, d, f) {
  if (typeof define === 'function' && define.amd)
    define(n, d, f);
  else if (typeof exports === 'object')
    module.exports = f.apply(r, d.map(function(m){return require(m)}));
  else
    r[n] = f.apply(r, d.map(function(m){return r[m]}));
}(this, 'lib1', [], function () {

  var myFunc = function myFunc(){
    console.log('lib1');
  };

  return myFunc;
}));

来，最后来看看效果。

//在node里加载
var example = require('./example');
example();

//在浏览器中使用require.js加载
require(['example'], function(example){example();});

<!-- 在浏览器中通过script标签加载 -->
<script src="lib1.js"></script>
<script src="lib2.js"></script>
<script src="example.js"></script>
<script>
  example();
</script>

上面三种方式都能正确输出如下结果

//=> "example"
//=> "lib1"
//=> "lib2"