部署在Vercel的Next.js应用无法访问Public目录文件求助

1. 核对文件名与路径大小写 #

Vercel运行在Linux系统上，文件名大小写敏感，而本地Windows/macOS环境可能不区分：

• 确保代码中写的/resume.pdf和public文件夹里的实际文件名完全一致（包括大小写，比如别把Resume.pdf用小写路径访问）
• 检查文件是否放在public根目录下，不要嵌套子文件夹却用根路径访问（比如public/assets/resume.pdf要对应/assets/resume.pdf）

2. 确认文件已被Git提交并部署 #

• 检查.gitignore文件，有没有误将.pdf或图片格式加入忽略规则，导致文件没传到Git仓库，Vercel部署时自然拉取不到
• 进入Vercel项目的Deployment页面查看Build Logs，确认public下的资源被打包上传

3. 配置basePath（如果部署在子路径） #

如果你的网站部署在Vercel的子路径下（比如xxx.vercel.app/portfolio），需要在next.config.js里添加basePath配置：

const nextConfig = {
  basePath: '/portfolio', // 替换成你的实际子路径
}

module.exports = nextConfig

之后资源路径要带上basePath，或者用Next.js的<Image>组件（图片场景）自动适配路径。

4. 尝试绝对路径测试 #

临时改用完整域名路径测试，排查是否是路径解析问题：

<a href='https://your-domain.vercel.app/resume.pdf' download>
  <button>Download Resume</button>
</a>

如果这个能正常下载，说明是基础路径配置或大小写问题，回到前面步骤排查。

5. 清除缓存重新部署 #

Vercel的旧缓存可能导致资源路径异常：在Deployment页面点击Redeploy，勾选Clear build cache后重新部署。

内容的提问来源于stack exchange，提问作者ryansle