在多个项目之间共享 node_modules 目录

Question

我是一名学习 EC6 的 Java 开发人员。我使用 npm 下载 JavaScript 包并使用 webpack 创建最终的 bundle.js 文件。

我有一个不错的项目文件夹，其中包含带有 java 文件的 java 模块，我想将 EC6 JavaScript 文件添加到我的 web 模块中。我使用maven来管理java jar依赖库。

这是我的文件夹结构：

my-project
  |-common-module
  |-ejb-module
  |-web-module-1
  |   |-src
  |       |-main
  |           |-java
  |               |-com.a.b
  |                   |-Hello.java
  |           |-webapp
  |               |-index.jsp
  |               |-bundle.js
  |               |-package.json
  |               |-webpack.config.js
  |               |-WEB-INF
  |               |-node_modules <-- I WANT THIS FOLDER TO BE MOVED AWAY FROM HERE 
  |               |-app          <-- react + ec6 javascript files
  |                   |-action
  |                   |-components
  |                   |-...
  |-web-module-2
      |-<same structure then under web-module-1>

当我在 my-project/web-module-1/src/main/webapp 文件夹中执行 npm install... 命令时，会出现一个名为node_modules 由 npm 在 webapp 目录下创建。此文件夹包含大量文件。

我的问题是，当我处理我的第二个 Web 项目并执行相同的 npm install... 命令时，会创建具有相同内容的第二个 node_modules 目录在 my-project/web-module-2/src/main/webapp 目录下。

我可以使用一个通用的、单独的 node_modules 目录来避免重复文件并节省磁盘空间吗？ 我可以在 ex.js 下存储 js 依赖项吗？ /home/user/javascript/modules 文件夹？

评论1：我不想以root身份执行npm并使用npm -g install！

评论 2：我也不想创建符号链接。

你能帮帮我吗？

---

编辑 我做了什么：

• 我为 JS 包创建了一个新文件夹： /home/user/javascript-modules.
• 已将 package.json 文件复制到 /home/user/javascript-modules。
• npm install --prefix /home/user/javascript-modules

之后，必要的 JS 模块被复制到我的 javascript-modules/node-modules 目录中。不错！

但是当我尝试执行 webpack 时，我得到一个缺少模块的错误：

• cd my-project/web-module-1/src/main/webapp
• ./home/user/javascript-modules/node_modules/.bin/webpack

结果：

Hash: a6bf1a0d210729a54be9
Version: webpack 1.14.0
Time: 39ms

ERROR in Entry module not found: Error: Cannot resolve module 'babel-loader' in /home/user/java/intellijmy-project/web-module-1/src/main/webapp

评论：我的 webpack.config.js 文件包含一行内容如下：loader: 'babel-loader'

有没有办法为 webpack 指定“类路径”？我的意思是告诉 webpack 模块在哪里。

---

更新 正如您在 cmets 中看到的那样，我尝试以多种不同的方式解决我的问题，但没有任何成功。对我来说，webpack 似乎不支持我想做的事情。好难过:(

就是这样。如果有人有任何可行的、好的和完整的解决方案，请与我们分享。谢谢。

Answer 1

使用 pnpm 代替 npm。

来自the pnpm project's website：

pnpm 使用硬链接和符号链接在磁盘上只保存一次模块的一个版本。例如，当使用 npm 或 Yarn 时，如果您有 100 个项目使用相同版本的 lodash，那么磁盘上将有 100 个 lodash 副本。使用 pnpm，lodash 将被保存在磁盘上的一个位置，并且硬链接会将其放入应该安装它的 node_modules 中。

1. 要在命令窗口中使用 npm 安装，请使用：

    npm install -g pnpm
   

2. 要更新现有的软件包安装（和所有子目录），请使用：

    pnpm install --recursive
   

或者，使用递归安装的快捷命令：

    pnpm i -r

在您通常使用npm 的任何地方使用pnpm。 （当pnpm 不支持时，此命令安全地回退到npm 函数。

Answer 2

为了让 npm 安装在自定义位置的目录中，您需要运行：

npm install --prefix path_to_node_modules_location

编辑：没有 package.json 的本地文件夹是不可能的。

所有项目的唯一“共同位置”是全局位置。 全局位置包含所有常用包，本地包含项目的特定包。

但是，我不确定为不同的项目使用一个通用的 local node_modules 文件夹是否是个好主意，因为您最终必须确保它们的依赖关系不会因为包的不同而发生冲突版本。 这意味着要为多个项目维护 package.json。

为了配置 webpack 查看新的位置检查 github link here

此处的加载器是相对于它们所应用的资源进行解析的。这意味着它们不会相对于配置文件进行解析。如果您从 npm 安装了加载程序，并且您的 node_modules 文件夹不在所有源文件的父文件夹中，则 webpack 找不到加载程序。您需要将 node_modules 文件夹作为绝对路径添加到 resolveLoader.root 选项。 (resolveLoader: { root: path.join(__dirname, "node_modules") })