如何将 webpack 指向特定的 node_modules 文件夹答案

【问题标题】：How to point webpack to a specific node_modules folder如何将 webpack 指向特定的 node_modules 文件夹
【发布时间】：2019-08-18 11:28:52
【问题描述】：

我正在尝试构建一个grpc Web 客户端，我需要打包代码来解析require 语句。

我已将protos 编译为js，如果我将它们放在我安装node modules 的当前文件夹中，它就可以工作。

问题是如果我在其他地方有 compiled proto 并且我从那里需要它们，webpack 会在该路径中查找 node modules。

来自我的client.js

工作版本：

const {StopRequest, StopReply} = require('./work_pb.js');

有问题的版本：

const {StopRequest, StopReply} = require('../../../messages/proto/output/work_pb.js');

在最后一种情况下，它在../../../messages/proto/output/ 中查找node modules。 node modules 安装在我的client.js 所在的当前路径以及我运行npx webpack client.js 的位置。

ERROR in /home/xxx/yyy/zzz/messages/proto/output/work_pb.js
Module not found: Error: Can't resolve 'google-protobuf' in '/home/xxx/yyy/zzz/messages/proto/output'
 @ /home/xxx/yyy/zzz/messages/proto/output/work_pb.js 11:11-37
 @ ./client.js

我如何告诉webpack 在当前路径中查找节点模块，而不是在已编译原型的路径中？

【问题讨论】：

标签： web webpack protocol-buffers grpc

【解决方案1】：

您可以指定resolve.modules 自定义目录，Webpack 在该目录中搜索具有绝对导入路径的模块：

// inside webpack.config.js
const path = require('path');
module.exports = {
  //...
  resolve: {
    modules: [path.resolve(__dirname, 'node_modules'), 'node_modules']
  }
};

这将使项目根目录（webpack 配置所在的位置）内的node_modules 优先于默认设置"node_modules"，后者通过node module resolution 算法解析路径。

更多信息：Webpack docs: Module Resolution

【讨论】：

谢谢，这有效，我刚刚在您的回答中添加了path。
更好.. 我将package.json 和webpack.config.js 移到我的app 文件夹之外（上一层），我仍然可以从app 运行npm install 和npx webpack client.js文件夹。我猜它会检查层次结构。
是的，npm install 将遍历到最近的 package.json 或 node_modules，如果在 cwd 中找不到。关于 webpack，我不太确定它将使用什么默认值。我认为，让一切尽可能明确和易于理解是值得的。这就是为什么我更喜欢通过--config 传递配置的原因。