seajs压缩打包过程

作者：zccst

[size=large][b]一、构建过程[/b][/size]
CMD 模块在构建时，有两个基本操作：
1，提取操作，用来提取模块的标识 id 和依赖 dependencies。
2，压缩操作。经过上面的提取操作后，构建工具就可以调用任何 JS 压缩工具来进行压缩了，require 参数也可以被压缩成任意字符。

举例，在a.js

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

//代码将改为
define('xxx/1.0.0/a', ['./b', './c'], function(require, exports) {
  var b = require('./b');
  var c = require('./c');
});

Sea.js 在运行 define 时，接受 factory 参数，可以通过 factory.toString() 拿到源码，再通过正则匹配 require 的方式来得到依赖信息。依赖信息是一个数组，比如上面 a.js 的依赖数组是：['./b', './c']


Sea.js 不需要通过 factory.toString() 和正则匹配的方式来获取依赖，直接从第二个参数中就可以拿到依赖数组。


[size=large][b]二、ID 和路径匹配原则[/b][/size]
所谓 ID 和路径匹配原则 是指，使用 seajs.use 或 require 进行引用的文件，如果是具名模块（即定义了 ID 的模块），会把 ID 和 seajs.use 的路径名进行匹配，如果一致，则正确执行模块返回结果。反之，则返回 null。

例如：

// 文件路径是 lib/jquery.js
// ID 和实际路径匹配了（.js 后缀会自动补上）
define('lib/jquery', function(require, exports, module) {
    // jquery code
    exports = $;
});

//当 jQuery 文件是上面的情况时，下面的变量 $ 能拿到正确的返回结果。

//使用 seajs.use
seajs.use('lib/jquery', function($) {
    // use $
});
//或者在模块中 require ：
define(function(require, exports, module) {
    var $ = require('$');
    // use $
});

[b]下面这种情况会返回null[/b]

// 文件路径是 lib/jquery.js
// 但是 ID 是 lib/jquery.min.js
// ID 和路径不匹配
define('lib/jquery.min', function(require, exports, module) {
// jquery code
exports = $;
});

[b]而匿名模块始终能正确返回结果：[/b]
// lib/jquery.js
// 匿名模块，不需要进行匹配
// 但是文件中只能有一个 define 块
define(function(require, exports, module) {
// jquery code
exports = $;
});
注意这里用于匹配的 ID 都是经过 alias 和 path 解析并且补完后缀之后的。


[b]为什么要有这个原则[/b]

回答这个问题前，请先阅读这篇文章：#426 。

首先，Sea.js 的模块启动接口秉承的是路径即 ID 的设计原则。seajs.use 的方法的第一个参数被规定为文件路径（而不是 ID），这样的设计减轻了记忆模块 ID 的负担，无论是匿名模块还是具名模块，开发者只需要知道文件放在哪儿就行了。

进一步的，之所以有这个 ID 和路径匹配原则，是因为在 CMD 的书写规范中，一个文件对应一个模块，所有的模块都是匿名模块（即 define(factory) 的形式）。那么当 seajs.use 某模块时，这个模块对应的文件里的唯一的 define 方法理所当然的是这个模块的执行代码，这时可以正确返回结果。


[size=large][b]三、自动压缩工具[/b][/size]


[size=large][b]普通压缩工具[/b][/size]
针对IE浏览器，要自己写ID


如果您觉得本文的内容对您的学习有所帮助，您可以微信：
[img]http://dl2.iteye.com/upload/attachment/0109/0668/fb266dfa-95ca-3d09-b41e-5f04a19ba9a1.png[/img]