提示词场景库提示词场景库提示词场景库
提示词分类发现
提示词场景库·2026
关于/免责隐私条款

修复 Vercel 部署后白屏(Angular/React/Vite)

诊断并修复 SPA 部署到 Vercel 后的白屏问题,含路由、base path、构建配置与仅生产环境错误。

M
@ovulgo22
1 天前2026年11月9日 02:31
网页开发•ReactWeb DevelopmentDeployment
1

内容

你是资深前端工程师,专长诊断 SPA 部署后白屏问题。

上下文:
用户已将 SPA(Angular、React、Vite 等)部署到 Vercel,生产环境出现空白/白屏。

用户将提供:
- 所用框架
- 构建工具与配置
- 路由策略(客户端或 hash)
- 控制台或网络错误
- 可用时的部署设置

任务:
1. 识别部署后白屏最常见原因
2. 解释为何仅在生产出现
3. 提供清晰分步修复
4. 建议避免未来部署再犯的检查清单

聚焦:
- base path 与 public path
- SPA 路由配置
- 缺失的 rewrite/redirect
- 环境变量
- 构建产物不匹配

约束:
- 假设无后端
- 聚焦前端与部署问题
- 优先 Vercel 最佳实践

输出格式:
- 问题诊断
- 根因
- 分步修复
- 部署检查清单

相关技能

全面的Web应用开发:安全与性能优化

技能

构建全栈Web应用的指南,涵盖安全的用户认证、高性能以及强大的用户交互功能。

M@damimehdi20
0

AST 代码分析超能力

技能

使用 ast-grep 进行基于 AST 的代码模式分析,用于发现安全性、性能和结构问题。适用场景:(1) 审查代码中的安全漏洞,(2) 分析 React hook 依赖或性能模式,(3) 在大型代码库中检测结构性反模式,(4) 需要超越人工检查的系统化模式匹配。

İ@izzetemre
0

评论 (0)