从零开始学习SeaJS入门教程之使用SeaJS第二部分详解

这种写法让HTML更简洁。

require

require 是SeaJS主要的模块加载方法。在一个模块里需要用到其他模块时，一般用它加载：
var m = require('/path/to/module/file');

简要说说SeaJS的自动加载机制：页面引入sea.js后，SeaJS会先下载入口模块，然后通过正则表达式匹配代码中所有的require，根据标识下载对应的js文件，并迭代处理。整个过程类似图的遍历（因为可能存在交叉循环依赖，依赖结构是个图而不是树）。
明白了这一点，下一条规则就很好理解了：传给require的路径标识必须是字符串字面量，不能是表达式。比如下面这样是错误的：

复制代码 代码如下:

require('module' + '1'); require('Module'.toLowerCase());

这会妨碍SeaJS的正则匹配，导致无法正确下载js文件。

require.async

SeaJS默认在页面打开时通过静态分析一次性加载所有需要的js文件。如果想让某个js文件用到时才下载，可以用 require.async：

复制代码 代码如下:

require.async('/path/to/module/file', function(m) { //code of callback... });

这样只有在用到这个模块时，对应的js文件才会下载，实现了按需加载。

SeaJS的全局配置
SeaJS提供了 seajs.config 方法设置全局配置，接收一个配置对象。用法如下：

复制代码 代码如下:

seajs.config({ base: 'path/to/jslib/', alias: { 'app': 'path/to/app/' }, charset: 'utf-8', timeout: 20000, debug: false });

base 表示基址路径。比如base设为 http://example.com/js/3-party/，那么 var $ = require('jquery'); 会加载 http://example.com/js/3-party/jquery.js。
alias 可以对较长的常用路径设置缩写。
charset 表示下载js时script标签的charset属性。
timeout 表示下载文件的最大时长，单位毫秒。
debug 表示是否工作在调试模式下。

SeaJS如何与现有JS库配合使用

要把jQuery等现有库与SeaJS一起用，只需按照SeaJS的模块定义规则封装一下。比如jQuery的封装：

复制代码 代码如下:

define(function() { //{{{jQuery原有代码开始 /*! * jQuery Ja vaScript Library v1.6.1 * http://jquery.com/ * * Copyright 2011, John Resig * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * Includes Sizzle.js * http://sizzlejs.com/ * Copyright 2011, The Dojo Foundation * Released under the MIT, BSD, and GPL Licenses. * * Date: Thu May 12 15:04:36 2011 -0400 */ //... //}}}jQuery原有代码结束 return $.noConflict(); });

SeaJS项目的打包部署

SeaJS原本集成了打包部署工具spm，后来作者为了更轻量，把spm拆成了独立项目。spm的核心思想是：将所有模块的代码合并压缩后并入入口模块。利用SeaJS本身的特性，HTML无需任何改动就能方便地在开发环境和生产环境间切换。不过spm目前还没有正式版本，这里就不详细展开了，感兴趣的朋友可以看看它的GitHub项目主页 https://github.com/seajs/spm/ 。
其实，每个项目用的JS合并压缩工具不尽相同，spm不一定完全适用。在理解SeaJS的原理之后，完全可以自己写一个符合项目特征的打包脚本。