seajs中模块引入路径解析规则详解和路径配置使用总结

阿酷| 阅读:275 发表时间:2017-07-24 16:02:49 前端技术

seajs中,模块引入的路径大致可分为三种:【相对标识】、【顶级标识】、【普通路径】,普通路径包括 “绝对路径”、“根路径”,等。

这里重点说明 【相对标识】 和 【顶级标识】。

相对标识 是指 "./","../" 开头的,如:"./OtherModule", "../lib/Base"。

顶级标识 是指 以文件或目录(可以包含:字母、-、_)开头的,如:"app/widget/Select"。

base 路径解析规则

1. 不可使用【顶级标识】,因为顶级标识就是相对于 base 基础路径来解析的,因此 base 本身只能使用【相对标识】或【根路径】等。

2. base 默认路径为 seajs 的目录,其他情况参见seajs官网,如果不是seajs推荐的源码目录结构,尽量手动设置 base 路径。

3. 【相对标识】:相对于 当前页面 解析。

paths 中路径解析规则

1. 【相对标识】:在哪里被引用,相对的解析位置视被引用的地方而定,遵循当地的规则。

2. paths中的字段会被以变量的方式在被使用的地方替换,然后再解析。

//path定义:
seajs.config({
    base:"./app/src",
    path:{
        "a":"../lib", //(1) 相对路径
        "lib":"path/to/lib", //(2) 顶级标识
        "l2":"/lib" //(3) 根路径
    }
});
//模块 mod/m/m.js: 
...
require("a/jquery");
//=> 转换为:"../../lib/jquery"
//=> 加载:mod/lib/jquery (特别注意 1)
...
//模块 mod/f.js:
...
require("a/jquery");
//=> 转换为:"../../lib/jquery"
//=> 加载:lib/jquery (特别注意 2)
...

alias 中路径解析规则

1. alias 的规则类似于 paths,并且 alias 路径也可以使用 paths 中的“变量”

2. 提醒:paths、alias 中尽量使用【顶级标识】、【根路径】、【绝对路径】,不要使用【相对标识】,因为在不同深度的模块引用时会解析为不同的路径。

3. 【相对标识】:在哪里被引用,相对的解析位置视被引用的地方而定,遵循当地的规则。

paths 和 alias 的设置仅仅相当于一个变量,在哪里使用,就在那里替换为设定的值,然后再解析。尽可能的使用【顶级标识】,如果不能使用【顶级标识】,比如目录跨越比较大等,则尽量设置 alias 或 paths 通过一个【非相对路径】 标识 定位到一个目录,然后在这个标识下,再定义ID。

SeaJs中路径配置的注意事项:

1. 顶级标识始终相对 base 基础路径解析。

2. 绝对路径和根路径始终相对当前页面解析。

3. require 和 require.async 中的相对路径相对当前模块路径来解析。

4. seajs.use 中的相对路径始终相对当前页面来解析。

本文由阿酷发表并编辑,转载此文章须经作者同意,并请附上出处及本页链接。如有侵权,请联系本站删除。