requirejs源码分析: 路径
1. 没有设置baseUrl(一般我们都会设置baseurl)
在没有设置baseUrl时, 默认 baseurl: “./”
当指定data-main时。 <script src="require.js" data-main="js/main.js"></script>. 将从data-main提取目录路径作为 baseurl,这里就是js/. 所有这里需要注意这里不能分成两个<script(一个加载require.js,一个加载main.js)来加载。这样baseurl将会是./加载依赖会可能会变找不到文件了。。。
源码以下:
dataMain = script.getAttribute('data-main');
if (dataMain) {
//Preserve dataMain in case it is a path (i.e. contains '?')
mainScript = dataMain;//Set final baseUrl if there is not already an explicit one.
if (!cfg.baseUrl) {
//Pull off the directory of data-main for use as the
//baseUrl.
src = mainScript.split('/');
mainScript = src.pop();
subPath = src.length ? src.join('/') + '/' : './';cfg.baseUrl = subPath;
}//Strip off any trailing .js since mainScript is now
//like a module name.
mainScript = mainScript.replace(jsSuffixRegExp, '');//If mainScript is still a path, fall back to dataMain
if (req.jsExtRegExp.test(mainScript)) {
mainScript = dataMain;
}//Put the data-main script in the files to load.
cfg.deps = cfg.deps ? cfg.deps.concat(mainScript) : [mainScript];return true;
}
2. paths设置
源码:
//A module that needs to be converted to a path.
paths = config.paths;syms = moduleName.split('/');
//For each module name segment, see if there is a path
//registered for it. Start with most specific name
//and work up from it.
for (i = syms.length; i > 0; i -= 1) {
parentModule = syms.slice(0, i).join('/');parentPath = getOwn(paths, parentModule);
if (parentPath) {
//If an array, it means there are a few choices,
//Choose the one that is desired
if (isArray(parentPath)) {
parentPath = parentPath[0];
}
syms.splice(0, i, parentPath);
break;
}
}//url 添加baseurl, .js 等
//Join the path parts together, then figure out if baseUrl is needed.
url = syms.join('/');
url += (ext || (/^data\:|\?/.test(url) || skipExt ? '' : '.js'));
url = (url.charAt(0) === '/' || url.match(/^[\w\+\.\-]+:/) ? '' : config.baseUrl) + url;
将依赖字符串作为键, 从config的paths查找对应的键值。 从这里可以看出paths中的键是可以是数组,但也只能取数组第一个元素。 如下这个就是根据lib去paths查找lib,这里lib实际的路径为 js/common/lib.js
requirejs.config({
baseUrl: 'js',
paths: {
lib: 'common/lib'
}
});
require(['lib'], function(){
// do sth
});
path设置为数组
会一个一个加载, 直到成功为至. 这里的失败是服务端报错,不能是服务端自定义404页面那是不行.
当报错时时,会将路径从path中删除, undef(重新初始化一些属性) ,然后重新require当前的ID.
源码:
onScriptError: function (evt) {
var data = getScriptData(evt);
if (!hasPathFallback(data.id)) {
return onError(makeError('scripterror', 'Script error for: ' + data.id, evt, [data.id]));
}
}
function hasPathFallback(id) {
var pathConfig = getOwn(config.paths, id);
if (pathConfig && isArray(pathConfig) && pathConfig.length > 1) {
//Pop off the first array value, since it failed, and
//retry
pathConfig.shift();
context.require.undef(id);
context.require([id]);
return true;
}
}
3. 插件加载
插件名!资源名方法. 示例如下:
require(['text!txt.txt'], function(){
// do sth
});
源码解析: 暂无
requirejs源码分析: 路径的更多相关文章
- requirejs源码分析: requirejs 方法–2. context.require(deps, callback, errback);
上一篇 requirejs源码分析: requirejs 方法–1. 主入口 中的return context.require(deps, callback, errback); 调用的是make ...
- requirejs源码分析: requirejs 方法–1. 主入口
该方法是 主要的入口点 也是最常用的方法. req = requirejs = function (deps, callback, errback, optional) { //Find the ri ...
- requirejs源码分析: config中shim
shim处理的源码: //Merge shim if (cfg.shim) { eachProp(cfg.shim, funct ...
- requirejs源码分析,使用注意要点
本文将深度剖析require.js代码,为了是大家更高效.正确的去使用它,本文不会介绍require的基本使用! 概要 先来一个流程图来概要一下大概流程 在require中,根据AMD(Asynchr ...
- requirejs源码分析: define 方法
define = function (name, deps, callback) { var node, context; //Allow for anonymous modules ...
- requirejs源码分析
- Spring Developer Tools 源码分析:二、类路径监控
在 Spring Developer Tools 源码分析一中介绍了 devtools 提供的文件监控实现,在第二部分中,我们将会使用第一部分提供的目录监控功能,实现对开发环境中 classpath ...
- Require.js 源码分析
本文将简单介绍下个人对require.js的源码分析,简单分析实现原理 一.require加载资源的流程 require中,根据AMD(Asynchronous Module Definition)的 ...
- zookeeper源码分析之五服务端(集群leader)处理请求流程
leader的实现类为LeaderZooKeeperServer,它间接继承自标准ZookeeperServer.它规定了请求到达leader时需要经历的路径: PrepRequestProcesso ...
随机推荐
- linux c++自己使用pthread封装的线程类
#include<iostream> #include<pthread.h> #include<unistd.h> using namespace std; //t ...
- sublime Text 3 使用插件追踪函数
一.下载工具 https://pan.baidu.com/s/1R0bZMMGQeKTTajIA-9DU3w 或者 https://pan.baidu.com/s/1R0bZMMGQeKTTajIA- ...
- Linux 进程创建二(execve和wait)
三:execve系统调用 int execve(const char *filename, char *const argv[],char *const envp[]); fork创建了一个新的进程, ...
- JavaScript 函数和事件
上面例子中的 JavaScript 语句,会在页面加载时执行. 通常,我们需要在某个事件发生时执行代码,比如当用户点击按钮时. 如果我们把 JavaScript 代码放入函数中,就可以在事件发生时调用 ...
- (转)Unity 导出XML配置文件,动态加载场景
参考:http://www.xuanyusong.com/archives/1919 http://www.omuying.com/article/48.aspx 主要功能: 1.导出场景的配置文 ...
- WPF 中双向绑定通知机制之ObservableCollection使用
msdn中 ObservableCollection<T> 类 表示一个动态数据集合,在添加项.移除项或刷新整个列表时,此集合将提供通知. 在许多情况下,所使用的数据是对象的集合 ...
- shell脚本中echo显示内容带颜色显示
格式如下 : echo -e "\033[41;36m something here \033[0m" 其中41的位置代表底色, 36的位置是代表字的颜色 注: 1.字背景颜色和文 ...
- Ajax工作原理及实例
1.关于ajax的名字 ajax 的全称是Asynchronous JavaScript and XML,其中,Asynchronous 是异步的意思,它有别于传统web开发中采用的同步的方式. 2. ...
- Android开发:《Gradle Recipes for Android》阅读笔记1.1
第一章1.1节 注:下面都是用android studio新建出来的默认项目配置,没有修改 1.settings.gradle记录了哪些子目录包含了它们自己的工程,例如:include':app',如 ...
- #1589 : 回文子串的数量(Manacher)
#1589 : 回文子串的数量 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 给定一个字符串S,请统计S的所有|S| * (|S| + 1) / 2个子串中(首尾位置不 ...