共计 3413 个字符，预计需要花费 9 分钟才能阅读完成。
下载
在 cmd 命令窗口通过 npm install saejs 下载
seajs 的 npm 下载指令查找方法如下
下载完成后，生成一个 node_modules 目录，seajs 核心文件放在 node_modules\seajs\dist 下，如下图所示
引入 seajs
新建 index.html 文件，将 sea.js 和 index.html 放在同一级目录
在 index.html 中通过 script 标签引入 sea.js
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Document</title>
</head>
<body>
<!– 引入 sea.js –>
<script type=”text/javascript” src=”./sea.js”></script>
<script type=”text/javascript”>
console.log(seajs)
</script>
</body>
</html>
seajs 向外暴露了一个变量 seajs, 在上面代码中输出 seajs
从控制台的输出可以看到，seajs 是一个对象，有很多属性和方法, 我们对其的配置，就是调用了里面的 config() 方法
config 方法的源码
seajs.config = function(configData) {
for (var key in configData) {
var curr = configData[key]
var prev = data[key]
// Merge object config such as alias, vars
if (prev && isObject(prev)) {
for (var k in curr) {
prev[k] = curr[k]
}
}
else {
// Concat array config such as map
if (isArray(prev)) {
curr = prev.concat(curr)
}
// Make sure that `data.base` is an absolute path
else if (key === “base”) {
// Make sure end with “/”
if (curr.slice(-1) !== “/”) {
curr += “/”
}
curr = addBase(curr)
}
// Set config
data[key] = curr
}
}
emit(“config”, configData)
return seajs
}
从 config 方法的源码 for (var key in configData) 可知，config() 方法的参数应该是一个对象，每一种配置项是一个属性（key:value,key 是配置名称，value 是配置结果），遍历 config() 方法的参数，并将每种配置的名称和结果放在 seajs.data(也是一个对象) 里面
标识符
seajs 模块标识分为 3 种：相对标识、顶级标识和普通标识。相对路径，以. 或 .. 开头顶级路径，不以. 或 .. 及斜线（/）开头普通路径，除相对和顶级路径外的，比如 /（根路径）开头的，”http://”、”https://”、”file:///” 等协议标识开头的模块命名空间是 seajs 所在文件的根路径即所谓的 base 路径，去除了 seajs/x.y.z 字串，也可以指定 seajs.config({base:});
base 配置
base 配置项在不设置时，表示的是 sea.js 文件位置，因为 seajs 的配置结果存放在 seajs.data 中，在控制台输出 seajs.data
本地电脑上 sea.js 文件位置
证明 base 就是 sea.js 文件所在的路径
在 main.js 中定义一个模块，并向外暴露
//main.js
// 定义一个没有 ID 的模块
define(function(require,exports,module){
// 向外暴露
module.exports.name = ‘ 张三 ’
})
在 index.html 文件中使用 seajs.use() 方法引入入口模块文件 main.js
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Document</title>
</head>
<body>
<!– 引入 sea.js –>
<script type=”text/javascript” src=”./sea.js”></script>
<script type=”text/javascript”>
// 引入入口模块
seajs.use(‘main’,function(a){
console.log(a) // a 为引入的入口文件内的模块向外暴露的对象
console.log(‘ 入口模块引入完毕 ’)
})
</script>
</body>
</html>
注意看 seajs.use() 方法里面的第一个参数，”main” 乍一看好像没问题，mian.js 不就是和 index.html 在同一级目录吗，其实不然，这是顶级路径 ( 不以.、..、/ 开头，直接以文件名或者文件夹名开头), 是相对于 sea.js 的路径而言的，只是刚好这里 sea.js 和 index.html 在同一级目录，所以看起来像是相对于 index.html, 如果写成./main 才是相对于 index.html 的路径而言
那我们尝试更改一下 sea.js 的位置，将 sea.js 放在和 index.html 同级目录的 module 文件夹下 (E:\SeajsTest\module\seajs), 将 main.js 放在和 index.html 同级目录的 module 文件夹下的 main 文件夹中
因为 sea.js 和 main.js 的位置变了, 此时 sea.js 的路径是 E:\SeajsTest\module\seajs, 引入 sea.js 后在控制台输出 seajs.data 验证
此时引入 main.js 时，如果使用顶级路径应该是 main/main，或者写相对路径 —-./module/main/main, 表示相对于 index.html
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Document</title>
</head>
<body>
<!– 引入 sea.js –>
<script type=”text/javascript” src=”./module/sea.js”></script>
<script type=”text/javascript”>
// 引入入口模块
// 1、使用顶级标识符
seajs.use(‘main/main’,function(a){
// 2、使用相对标识符
// seajs.use(‘./module/main/main’,function(a){
console.log(a)
console.log(‘ 入口模块引入完毕 ’)
})
</script>
</body>
</html>
控制台输出
修改默认 base
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Document</title>
</head>
<body>
<!– 引入 sea.js –>
<script type=”text/javascript” src=”./module/sea.js”></script>
<script type=”text/javascript”>
// 修改 base
seajs.config({
base:’main/’ //base:”./main” 写法是错误，因为也遵循 seajs 标识符的规则，./main/ 表示和 index.html 同级的 main 目录下
})
// 引入入口模块
// 1、使用顶级标识符
seajs.use(‘main’,function(a){
// 2、使用相对标识符
// seajs.use(‘./module/main/main’,function(a){
console.log(a)
console.log(‘ 入口模块引入完毕 ’)
})
</script>
</body>
</html>
如上所示，我将 base 修改为 main/ 表示和 sea.js 同级的 main 目录下，即 E:\SeajsTest\module\main, 此处不能使用 base:./main/，因为加上./ 就表示相对于 index.html 了，从下图中控制台输出的路径就可以看出来
alias（别名）配置
