最近在试着用 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"

模块路径解析

替换alias

添加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"
});

PS: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模块路径解析 简单总结的更多相关文章

  1. [webpack]--webpack 如何解析代码模块路径

    前言 webpack是如何解析代码模块路径 webpack 中有一个很关键的模块 enhanced-resolve 就是处理依赖模块路径的解析的,这个模块可以说是 Node.js 那一套模块路径解析的 ...

  2. requirejs:让人迷惑的路径解析

    接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模块依赖声明都是很重要的一步.而其中涉及到的模块路径解析,对于新手来说,有的时候会让人觉得 ...

  3. 转:requirejs:让人迷惑的路径解析(~~不错)

    接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模块依赖声明都是很重要的一步.而其中涉及到的模块路径解析,对于新手来说,有的时候会让人觉得 ...

  4. nodejs系列笔记02---模块路径解析

    模块路径解析规则 参考这篇博客 我们已经知道,require函数支持斜杠(/)或盘符(C:)开头的绝对路径,也支持./开头的相对路径.但这两种路径在模块之间建立了强耦合关系,一旦某个模块文件的存放位置 ...

  5. seajs模块标识命名和解析规则

    模块标识采用路径形式,但要注意与路径的区别.require.require.async的第一个参数是模块标识.而seajs.use第一个参数为文件路径. use是全局的,require是局部的.模块标 ...

  6. python模块介绍- HTMLParser 简单的HTML和XHTML解析器

    python模块介绍- HTMLParser 简单的HTML和XHTML解析器 2013-09-11 磁针石 #承接软件自动化实施与培训等gtalk:ouyangchongwu#gmail.comqq ...

  7. grunt任务之seajs模块打包

    grunt与seajs grunt是前端流行的自定义任务的脚手架工具,我们可以使用grunt来为我们做一些重复度很高的事情,如压缩,合并,js语法检查等.通过定义grunt的配置文件Gruntfile ...

  8. perl6 JSON::Fast模块json解析的使用

    关于JSON: JSON (JavaScript Object Notation)是一种轻量级的数据交换格式,语法简单,各种语言都有相应的库或者模块支持. 因为JSON非常小巧,解析起来又非常简单,我 ...

  9. 多模块分布式系统的简单服务访问 - OSGI原形(.NET)

    多模块分布式系统的简单服务访问 - OSGI原形(.NET) 先描述一下本篇描述的适用场景(3台server, 各个模块分布在各个Server上,分布式模块互相依赖.交互的场景): 多个OSIG引擎交 ...

随机推荐

  1. OpenSSL命令---CRL

    用途: crl工具,用于处里PME或DER格式的CRL文件. 用法: openssl crl [-inform PEM|DER] [-outform PEM|DER] [-text] [-in fil ...

  2. kubernetes 滚动更新发布及回滚

    基本命令 记录历史 --record kubectl  apply -f **** --record 查看当前状态 kubectl rollout status deployment/demo -w ...

  3. python中GUI使用小结

    1 先来个简单的 import wx app = wx.App() frm = wx.Frame(None, title="Hello World") frm.Show() app ...

  4. [Git01]Pro Git 第三章 分支 读书笔记

    [git]分支   Git 的分支模型称为“必杀技特性”,而正是因为它,将 Git 从版本控制系统家族里区分出来. Git 有何特别之处呢?Git 的分支可谓是难以置信的轻量级,它的新建操作几乎可以在 ...

  5. Hadoopd 单元测试-MPUnit

    Apache 版: 官网:http://mrunit.apache.org 教程:https://cwiki.apache.org/confluence/display/MRUNIT/MRUnit+T ...

  6. androidstudio提示adb错误:cannot parse version string:kg01的解决方法

    打开adb.exe的文件目录,同时按下shift和鼠标右键,打开cmd后运行一下这个命令adb kill-server

  7. c# 调用微信小程序

    //微信也不给个c#调用的例子 只好自己造咯:ps:大佬勿喷 1 public string GetWx(string code, string iv, string encryptedData) { ...

  8. Apache commons StringUtils 在运行时出现NoClassDefError错误的解决方法

    Apache commons StringUtils 在运行时出现NoClassDefError错误的解决方法 在用tomcat运行WEB项目,并且使用了StringUtils包的时候,会出现 jav ...

  9. 纸壳CMS的插件加载机制

    纸壳CMS是一个开源的可视化设计CMS,通过拖拽,在线编辑的方式来创建网站. GitHub https://github.com/SeriaWei/ZKEACMS.Core 欢迎Star,Fork,发 ...

  10. BZOJ 1834--网络扩容(最大流&费用流)

    1834: [ZJOI2010]network 网络扩容 Time Limit: 3 Sec  Memory Limit: 64 MBSubmit: 3351  Solved: 1750[Submit ...