seajs模块路径解析 简单总结

seajs模块路径解析

最近在试着用seajs + grunt改造现有项目， 遇到的最大的问题就是seajs命名与调用， 简单总结一下。

模块调用

seajs中调用模块有两种方式，seajs.use(ID) 、 require(ID)。

ID命名

• 完整绝对路径 例如 "http://example.com/test/js/jquery/jquery.js"
• 以 "." 开头 例如 "./home/main" "../main"
• 以 "/" 开头 例如 "/js/home/"
• 普通命名 例如 "home/main"

模块路径解析

1. 替换alias
2. 添加base前缀

可以在seajs.config()方法中设置ID别名和基础路径, 例如：

seajs.config({ ???base:"js", ???alias: { ???????jquery: "/jquery/jquery" ???}})

base添加规则

• 完整的绝对路径 不会加base

• 以 "." 开头 会相对于当前（被调用的）模块解析地址。 如果不存在被调用的模块（如seajs.use() ）， 则会相对于当前页面解析地址。

• 以 "/" 开头 相对于当前页面的根目录 解析地址

• 普通命名 直接加上base前缀

base值

• base 默认值是 seajs所在目录

• seajs.config()中base的解析与ID命名解析规则相同

例如:

http://example.com/test/js/sea/sea.js

http://example.com/test/index.html

在index.html中调用了sea.js

base的默认值为 "http://example.com/test/js/sea/"

如果使用seajs.config()设置了base

seajs.config({ ???base: "home" ?// base值为 "http://example.com/test/js/sea/home"});seajs.confg({ ???base: "./home" ?// base值为 "http://example.com/test/home"});seajs.conifg({ ???base: "/home" ??// base值为 "http://example.com/home"});

seajs.config()中的base 与 seajs.use() 的ID一样， "." 开头的ID 会相对于当前页面 解析地址（因为不存在被调用的模块）

完整的解析例子：

有如下文件

http://example.com/test/js/sea/sea.js

http://example.com/test/js/home/main.js

http://example.com/test/js/home/tpl.js

http://example.com/test/index.html

index.html页面调用sea.js

seajs.config({ ???base: "./js" ???????// base为 "http://example.com/test/js" ???alias: { ???????"jquery": "jquery/jquery" ???}});// 调用 mian seajs.use("home/main"); ????// 解析后的路径为 "http://example.com/test/js/home/main.js"// 也可以这么写seajs.use("./js/home/main"); ???// 解析路径为 "http://example.com/test/js/home/main.js"main.jsdefine(function(require) { ???var $ = require("jquery"); ?????// "http://example.com/test/js/jquery/jquery.js" ???// 调用 tpl ???var tpl = require("./tpl"); ????// "http://example.com/test/js/home/tpl.js" ???// 也可以 ???var tpl = require("home/tpl"); ?// "http://example.com/test/js/home/tpl.js"});

以上例子中的模块define() 都没有定义ID， 实际上项目中打包时会根据配置 自动为模块设定ID， 打包到同一个文件中， 相关问题以后有时间再总结。