seajs中模組的解析規則詳解和模組使用總結

seajs github 模組標識已經說的相對清楚了。但並沒有面面俱到，特別是當你需要手寫【模組ID】和【模組依賴】的時候，或者自己寫自動化工具來做transport 的時候（ps:spm貌似適應性不是很強也不易用，畢竟每個專案的目錄結構可能相差很大，且不易改變。
注意事項：
1. 頂層標識始終相對 base 基礎路徑解析。
2. 絕對路徑和根路徑總是相對當前頁面解析。
3. require 和 require.async 中的相對路徑相對當前模組路徑來解析。
4. seajs.use 中的相對路徑總是相對當前頁面來解析。

seajs中，模組的ID大致可分為三種：【相對標識】、【頂級標識】、【普通路徑】，
普通路徑包括 “絕對路徑”、“根路徑”，等。

這裡重點說明【相對標識】和【頂層標識】。
相對標識是指 "./","../" 開頭的，如："./OtherModule", "../lib/Base"。
頂層標識是指以檔案或目錄（可以包含：字母、-、_）開頭的，如："app/widget/Select"

需要寫模組ID的地方有三個：

複製程式碼程式碼如下:

define(" id (1)",["../id2 (2)"], function(require, exports, module){
    var moduleA = require('./moduleA (3)');
}) 

注意：無論是define第一個參數【模組ID】或是第二個參數【依賴模組的ID】或是【require模組ID】，最終的比對標準是【解析後的檔案URI】。
因此，這三處需要寫ID 的地方可以以任意一種方式來寫，只要最終解析為同一個URI，即被認為是同一個模組。
在解析ID的過程中，會預先經過 seajs.config 中定義的 alias 和 paths 的處理。

base 路徑解析規則
(第1 層，本身的路徑不依賴任何設定)
1. 不可使用【頂層識別】，因為頂層標識就是相對於base 基礎路徑來解析的，因此base 本身只能使用【相對標識】或【根路徑】等。
2. base 預設路徑為 seajs 的目錄，其他情況請參考seajs官網，如果不是seajs建議的源碼目錄結構，盡量手動設定 base 路徑。
3. 【相對標識】：相對於目前頁面解析。
paths 中路徑解析規則
(第1 層，本身的路徑不依賴任何設定)
1. 【相對標識】：在哪裡被引用，相對的解析位置視被引用的地方而定，遵循當地的規則。
2. paths中的欄位會被以變數的方式在被使用的地方替換，然後再解析。
例如：

複製程式碼程式碼如下:

//程式碼區塊（1）
//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 中路徑解析規則
（第2 層，本身的路徑可以依賴paths的設定）
1. alias 的規則類似paths，而alias 路徑也可以使用paths 中的「變數」
2. 提醒：paths、alias 盡量使用【頂級識別】、【根路徑】、【絕對路徑】，不要使用【相對標識】，因為在不同深度的模組引用時會解析為不同的路徑。
3. 【相對標識】：在哪裡被引用，相對的解析位置視被引用的地方而定，遵循當地的規則。
seajs.use 路徑解析規則
【相對標識】：相對於目前頁解析。
define 定義模組 ID 解析規則 (1)

（第3 層，路徑可以相對於alias 或paths 來設定）
可以使用：【相對標識】、【頂級標識】、【根路徑】
建議使用【頂級標識】，如果模組的位置不在base 基礎路徑內，則使用【相對標識】或【根路徑】。
【相對識別】：相對目前頁面解析

複製程式碼程式碼如下:

// 程式碼區塊（2）
//config -- 也使用[程式碼區塊(1)]中的設定

// 模組1，無歧義，根路徑解析
define("/app/src/module/Base", ..);
// 模組2，無歧義，頂級標識，相對於base 基礎路徑來解析
define("app/src/module/Base", ..);
// 模組3，有歧義，相對標識，此處相對於當前頁面（引用到這個模組的html頁）
// 但其他地方即便使用【表面上相同的「ID」】，也可能會被解析不同的模組
define("./app/src/module/Base",.. );

模組依賴ID 解析規則 (2)

（第3 層，路徑可以相對於alias 或paths 來設定）
【相對識別】：相對base 基礎路徑解析

複製程式碼

複製程式碼
複製程式碼

複製程式碼
複製程式碼

複製程式碼
程式碼如下:

//程式碼區塊（3）//config -- 也使用[程式碼區塊(1)]中的設定 //無歧義，相對於根路徑解析

define("..", ["/app/src/module/Base"], ..)

// 無歧義，頂級標識，相對於base 基礎路徑解析define("..", ["app/src/module/Base"], ..)//有歧義，相對標識，此處相對於當前模組來解析//此處的依賴看起來是依賴【程式碼區塊（2）】中的`模組3`//但如果目前模組跟目前頁面不在同一層目錄下，就不會被解析為`模組3`define("..", ["./app/src/module/Base"],..)

模組內require 其他模組的ID 解析規則(3)
（第3 層，路徑可以相對於alias 或paths 來設定）

【相對標識】：相對base 基礎路徑解析

複製程式碼

程式碼如下:

//程式碼區塊（4）
//config --也使用[程式碼區塊(1)]中的配置

define("..", [..], function(require){
//無歧義，相對於根路徑解析 require("/app/src/module/Base");

}); define("..", [..], function(require){
// 無歧義，頂級標識，相對於base 基礎路徑解析
require("app/src/module/Base ");
});

define("..", [..], function(require){ //有歧義，相對標識，此處相對於當前模組來解析 //此處的依賴看起來是依賴【程式碼區塊（2）】中的`模組3` //但如果目前模組跟目前頁面不在同一層目錄下，就不會被解析為`模組3` require(" ./app/src/module/Base");})特別提醒：模組內三處需要寫ID的地方，不需要使用看起來相同的字串，只要被解析為相同的模組即可。總結：1.paths 和 alias 的設定僅僅相當於一個變量，在哪裡使用，就在那裡替換為設定的值，然後再解析。 2.盡可能的使用【頂層標識】。 3.如果不能使用【頂級標識】，例如目錄跨越比較大等，則盡量設定 alias 或 paths 透過一個【非相對路徑】標識定位到一個目錄，然後在這個標識下，再定義ID。

seajs中模組的解析規則詳解和模組使用總結_Seajs