如何在Node.js Express多项目间共享外部目录的ES6模块文件

咱们先拆解下你遇到的核心问题：客户端浏览器的ES6模块导入是基于HTTP请求的，不是直接读取服务器的文件系统路径。你之前用./../../utilities/utilities.js这种相对路径，浏览器会把它解析成相对于当前页面的URL路径，但你的Express服务器并没有为上层的utilities目录配置可访问的路由，所以自然会请求失败。CORS在这里不是问题（所有请求都来自同一服务器的同源地址），核心是Express的静态资源路由配置没跟上。

下面给你两种实用的解决方案，直接就能套用：

方案1：给utilities目录添加静态路由（最简单直接） #

这是最适合你的场景的方法，只需要在Express中把utilities目录配置为静态资源目录，让浏览器能通过合法的HTTP请求获取到里面的文件。

1. 修改app.js的Express配置 #

在现有代码基础上，新增一行静态路由配置：

const express = require('express');
const app = express();

// 原有的项目静态资源路由
app.use(express.static(`./project/public`));
// 注：你原来的代码这里有小问题，app.use的第二个参数应该是路由处理函数，需要用require引入
app.use(`/project`, require(`./project/index.js`));

// 新增：把utilities目录暴露为静态资源，用/utilities作为路由前缀
app.use('/utilities', express.static('./utilities'));

2. 修正前端的importmap #

现在浏览器可以通过/utilities/utilities.js这个绝对URL访问到共享模块了，更新你的importmap：

<script type="importmap">
  {
    "imports": {
      "u": "/utilities/utilities.js"
    }
  }
</script>

用绝对路径（以/开头）会更可靠，不会因为页面URL的层级变化出问题。

3. 验证效果 #

现在你的script.js里的import wow from 'u';就能正常请求到utilities.js了，alert也能正常弹出"woo"。

方案2：单独路由提供共享模块（更安全，适合只共享单个文件） #

如果你不想把整个utilities目录都暴露为静态资源，只想共享utilities.js这一个文件，可以创建一个专门的路由来返回这个文件，安全性更高：

1. 修改app.js配置 #

先引入path模块，再添加专属路由：

const express = require('express');
const path = require('path');
const app = express();

// 原有的项目配置
app.use(express.static(`./project/public`));
app.use(`/project`, require(`./project/index.js`));

// 新增：专门的路由返回utilities.js文件
app.get('/shared-utilities', (req, res) => {
  const utilityFilePath = path.resolve(__dirname, './utilities/utilities.js');
  res.sendFile(utilityFilePath, (err) => {
    if (err) {
      res.status(404).send('共享工具文件未找到');
    }
  });
});

2. 更新importmap #

<script type="importmap">
  {
    "imports": {
      "u": "/shared-utilities"
    }
  }
</script>

这种方式还能在路由里加权限验证、缓存控制等逻辑，比暴露整个目录更灵活安全。

额外答疑（对应你提出的疑问） #

• 是不是需要加更多静态路由？对，方案1就是这个思路，核心是让Express能处理共享文件的HTTP请求。
• 是Node还是Express的配置问题？是Express的路由配置问题，Node本身不需要额外调整。
• 是CORS的问题吗？不是，所有请求都来自同一服务器的同源地址（协议、域名、端口一致），CORS不会拦截这类请求。
• 要不要用动态import？完全不需要，静态import就能满足你的共享需求，动态import更适合按需加载的场景。

备注：内容来源于stack exchange，提问作者Michael VanLaanen