模块解析

解析器是一个库，它通过其绝对路径帮助定位模块。模块可以作为另一个模块的依赖项被引入，例如

import foo from 'path/to/module';
// or
require('path/to/module');

依赖模块可以来自应用程序代码或第三方库。解析器帮助 webpack 找到需要包含在每个此类 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` 发生时的源文件目录被视为上下文目录。`import/require` 中指定的相对路径将与该上下文路径连接，以生成模块的绝对路径。

import 'module';
import 'module/lib/file';

在 resolve.modules 中指定的所有目录中搜索模块。您可以使用 resolve.alias 配置选项为模块创建别名，以替换原始模块路径。

如果包包含 `package.json` 文件，则按顺序查找 resolve.exportsFields 配置选项中指定的字段，`package.json` 中的第一个此类字段根据包导出指南确定包的可用导出。

根据上述规则解析路径后，解析器会检查路径是否指向文件或目录。如果路径指向文件

如果路径指向文件夹，则执行以下步骤以找到具有正确扩展名的正确文件

如果文件夹包含 `package.json` 文件，则按顺序查找 resolve.mainFields 配置选项中指定的字段，`package.json` 中的第一个此类字段确定文件路径。
如果没有 `package.json` 或 resolve.mainFields 未返回有效路径，则按顺序查找 resolve.mainFiles 配置选项中指定的文件名，以查看导入/要求的目录中是否存在匹配的文件名。
然后，文件扩展名使用类似的方法解析，使用 resolve.extensions 选项。

Webpack 根据您的构建目标提供这些选项的合理默认值。

这遵循与为文件解析指定相同的规则。但是，resolveLoader 配置选项可用于为加载器设置单独的解析规则。

每个文件系统访问都被缓存，以便对同一文件的多个并行或串行请求更快地完成。在监视模式下，只有修改过的文件才会从缓存中清除。如果监视模式关闭，则在每次编译之前都会清除缓存。

有关上面提到的配置选项的更多信息，请参阅 Resolve API。

« 上一页