如何配置Vercel上的Node.js项目以实现公共资产可访问？

我正在开发一个部署在Vercel上的Node.js应用，需要确保公共资产（如图片）能通过URL正常访问。以下是当前的配置、项目结构和代码：

当前配置与代码 #

vercel.json 配置 #

{
  "version": 2,
  "builds": [
    {
      "src": "dist/server.js",
      "use": "@vercel/node",
      "config": { "includeFiles": ["dist/**"] }
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "dist/server.js"
    }
  ],
  "public": true
}

项目结构 #

server.js 代码 #

import express, { Request, Response } from 'express';
import cors from 'cors';
import dotenv from 'dotenv';
import routes from './routes';

dotenv.config();

const app = express();
const port: Number = 3000;

const corsOption = {
  origin: process.env.BASE_URL,
};

app.use(cors(corsOption));

app.use(express.json({ limit: '20mb' }));

app.use('/public', express.static('public'));

app.use('/api', routes);

app.get('/', (req: Request, res: Response) => {
  return res.send('Server running');
});

app.listen(port, () => {
  console.log('Server is listening on ' + port);
});

问题原因 #

1. 部署包未包含public目录：vercel.json 的 includeFiles 仅指定了 dist/**，导致Vercel部署时不会上传 public 目录，生产环境中找不到静态资源。
2. 静态文件路径错误：Express中使用相对路径 'public'，在Vercel的生产环境中，Node.js的工作目录与本地不一致，无法正确定位到静态资源目录。

修复方案 #

1. 更新 vercel.json 配置 #

修改配置，让Vercel包含 public 目录，并优先处理静态资源路由：

{
  "version": 2,
  "builds": [
    {
      "src": "dist/server.js",
      "use": "@vercel/node",
      "config": { "includeFiles": ["dist/**", "public/**"] }
    }
  ],
  "routes": [
    // 优先匹配public目录下的资源，直接返回，无需经过Express
    {
      "src": "/public/(.*)",
      "dest": "/public/$1"
    },
    // 其他请求交给Express处理
    {
      "src": "/(.*)",
      "dest": "dist/server.js"
    }
  ],
  "public": true
}

2. 调整Express静态资源路径 #

使用绝对路径定位 public 目录，避免环境差异导致的路径错误：

// 导入path模块
import path from 'path';

// 替换原有的静态资源挂载代码
app.use('/public', express.static(path.join(__dirname, '../public')));

• __dirname 指向当前文件（dist/server.js）所在目录，通过 ../public 回到项目根目录下的 public 文件夹，确保本地和生产环境路径一致。

3. 验证 #

• 本地运行：访问 http://localhost:3000/public/[图片文件名]，确认图片正常加载。
• 部署后：访问 https://你的Vercel域名/public/[图片文件名]，验证资源可访问。

内容的提问来源于stack exchange，提问作者Rizki Okto S