模塊解析(Module Resolution)

resolver 是一個庫(library)，用於幫助找到模塊的絕對路徑。一個模塊可以作為另一個模塊的依賴模塊，然後被後者引用，如下：

import foo from ‘path/to/module‘
// 或者
require(‘path/to/module‘)

所依賴的模塊可以是來自應用程序代碼或第三方的庫(library)。resolver 幫助 webpack 找到 bundle 中需要引入的模塊代碼，這些代碼在包含在每個 require/import 語句中。 當打包模塊時，webpack 使用 enhanced-resolve 來解析文件路徑

webpack 中的解析規則

使用 enhanced-resolve，webpack 能夠解析三種文件路徑：

絕對路徑

import "/home/me/file";

import "C:\\Users\\me\\file";

由於我們已經取得文件的絕對路徑，因此不需要進一步再做解析。

相對路徑

import "../src/file1";
import "./file2";

在這種情況下，使用 import 或 require 的資源文件(resource file)所在的目錄被認為是上下文目錄(context directory)。在 import/require

模塊路徑

import "module";
import "module/lib/file";

模塊將在 resolve.modules 中指定的所有目錄內搜索。

你可以替換初始模塊路徑，此替換路徑通過使用 resolve.alias 配置選項來創建一個別名。

一旦根據上述規則解析路徑後，解析器(resolver)將檢查路徑是否指向文件或目錄。如果路徑指向一個文件：

• 如果路徑具有文件擴展名，則被直接將文件打包。
• 否則，將使用 [resolve.extensions
  ] 選項作為文件擴展名來解析，此選項告訴解析器在解析中能夠接受哪些擴展名（例如 .js, .jsx）。

如果路徑指向一個文件夾，則采取以下步驟找到具有正確擴展名的正確文件：

• 如果文件夾中包含 package.json 文件，則按照順序查找 resolve.mainFields 配置選項中指定的字段。並且 package.json 中的第一個這樣的字段確定文件路徑。
• 如果 package.json 文件不存在或者 package.json 文件中的 main 字段沒有返回一個有效路徑，則按照順序查找 resolve.mainFiles 配置選項中指定的文件名，看是否能在 import/require 目錄下匹配到一個存在的文件名。
• 文件擴展名通過 resolve.extensions 選項采用類似的方法進行解析。

webpack 根據構建目標(build target)為這些選項提供了合理的默認配置。

解析 Loader(Resolving Loaders)

Loader 解析遵循與文件解析器指定的規則相同的規則。

但是 resolveLoader 配置選項可以用來為 Loader 提供獨立的解析規則。

緩存

每個文件系統訪問都被緩存，以便更快觸發對同一文件的多個並行或串行請求。

在觀察模式下，只有修改過的文件會從緩存中摘出。

如果關閉觀察模式，在每次編譯前清理緩存。

有關上述配置的更多信息，請查看解析 API學習。

webpack-Module Resolution（模塊解析）