标签:style class blog code http color
最近在试着用seajs + grunt改造现有项目, 遇到的最大的问题就是seajs命名与调用, 简单总结一下。
seajs中调用模块有两种方式,seajs.use(ID) 、 require(ID)。
可以在seajs.config()方法中设置ID别名和基础路径, 例如:
seajs.config({ base:"js", alias: { jquery: "/jquery/jquery" } })
完整的绝对路径 不会加base
以 "." 开头 会相对于当前(被调用的)模块解析地址。 如果不存在被调用的模块(如seajs.use() ), 则会相对于当前页面解析地址。
以 "/" 开头 相对于当前页面的根目录 解析地址
普通命名 直接加上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.js define(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, 打包到同一个文件中, 相关问题以后有时间再总结。
seajs模块路径解析 简单总结,布布扣,bubuko.com
标签:style class blog code http color
原文地址:http://www.cnblogs.com/blackwood/p/3809826.html