modules

2024年11月23日

柏拉文

越努力，越幸运

一、认识

---

Webpack 的 resolve.modules 是一个重要配置项，用于定义模块解析时 Webpack 应该搜索的目录。它影响到如何定位依赖模块和解决模块路径问题。当你在代码中使用 import 或 require 时，Webpack 需要找到模块的实际位置。resolve.modules 指定了 Webpack 在解析模块时应该从哪些目录中查找模块，类似于 Node.js 中的模块解析机制。

默认情况下，Webpack 会在以下位置查找模块:

1. 当前目录下的 node_modules。

2. 父目录的 node_modules，逐级向上查找，直到文件系统的根目录。

通过配置 resolve.modules，你可以：

1. 优化模块解析路径。

2. 添加自定义目录，避免长路径引用。

3. 避免与默认 node_modules 目录冲突。

二、语法

---

const path = require('path');

module.exports = {
  resolve: {
    modules: [path.resolve(__dirname, 'src'), 'node_modules'],
  }
};

1. Webpack 会优先在 src 目录下查找模块。

2. 如果在 src 找不到模块，会继续查找 node_modules。