部署AstroJS+Sanity项目到Vercel时遇tslib导入解析失败错误

问题根源 #

这是Vercel构建环境中pnpm包管理器的依赖解析异常：本地pnpm已缓存tslib依赖，但Vercel的隔离构建环境里，rxjs依赖的tslib未被正确关联到项目根依赖，导致Rollup无法找到该模块。

解决方案步骤 #

1. 显式安装tslib依赖 #

rxjs依赖tslib但未被自动添加到项目根依赖列表，手动安装即可：

pnpm add tslib --save

安装完成后，提交更新后的package.json和pnpm-lock.yaml到代码仓库，重新触发Vercel构建。

2. 调整Vercel构建命令 #

如果显式安装后问题仍存在，修改Vercel项目的构建配置：

• 进入项目的Build & Development Settings页面
• 将Install Command修改为pnpm install --shamefully-hoist，强制pnpm把所有嵌套依赖提升到根node_modules，避免依赖路径解析错误
• 确认Build Command保持Astro默认的astro build

3. 修正错误的Vite配置 #

之前将tslib设为外部依赖的操作是错误的（浏览器环境需要打包tslib），请调整vite.config.ts：

import { defineConfig } from 'vite';
import { astroViteConfig } from '@astrojs/vite-plugin';

export default defineConfig({
  ...astroViteConfig,
  resolve: {
    extensions: ['.ts', '.js', '.mjs'],
  },
});

4. 清除Vercel构建缓存 #

缓存可能遗留旧的依赖问题，进入Vercel项目的Deployments页面，找到最近的失败部署，点击Redeploy并勾选Clear build cache后重新部署。

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