|
|
@@ -0,0 +1,129 @@
|
|
|
+# 部署指南 / Deployment Guide
|
|
|
+
|
|
|
+## 🚀 支持的部署平台
|
|
|
+
|
|
|
+### Vercel 部署
|
|
|
+
|
|
|
+- **地址**: https://yffs.vercel.app/
|
|
|
+- **特点**: 自动部署、边缘网络、无服务器函数支持
|
|
|
+- **配置文件**: `vercel.json`
|
|
|
+
|
|
|
+### Netlify 部署
|
|
|
+
|
|
|
+- **地址**: https://whattoeatai.netlify.app/
|
|
|
+- **特点**: 持续部署、表单处理、重定向规则
|
|
|
+- **配置文件**: `netlify.toml`
|
|
|
+
|
|
|
+## 🔧 环境变量配置
|
|
|
+
|
|
|
+部署前需要配置以下环境变量:
|
|
|
+
|
|
|
+```env
|
|
|
+# 文本生成 API(零一万物)
|
|
|
+VITE_TEXT_GENERATION_BASE_URL=https://api.lingyiwanwu.com/v1/
|
|
|
+VITE_TEXT_GENERATION_API_KEY=your_text_api_key_here
|
|
|
+VITE_TEXT_GENERATION_MODEL=yi-lightning
|
|
|
+
|
|
|
+# 图片生成 API(智谱 AI)
|
|
|
+VITE_IMAGE_GENERATION_BASE_URL=https://open.bigmodel.cn/api/paas/v4/
|
|
|
+VITE_IMAGE_GENERATION_API_KEY=your_image_api_key_here
|
|
|
+VITE_IMAGE_GENERATION_MODEL=cogview-3-flash
|
|
|
+```
|
|
|
+
|
|
|
+## 📋 部署步骤
|
|
|
+
|
|
|
+### Vercel 部署步骤
|
|
|
+
|
|
|
+1. **Fork 项目**到你的 GitHub 账户
|
|
|
+2. **登录 Vercel**并连接 GitHub
|
|
|
+3. **导入项目**:选择 fork 的仓库
|
|
|
+4. **配置环境变量**:在 Vercel 项目设置中添加上述环境变量
|
|
|
+5. **部署**:Vercel 会自动构建和部署
|
|
|
+
|
|
|
+或者使用一键部署:
|
|
|
+[](https://vercel.com/new/clone?repository-url=https://github.com/liu-ziting/what-to-eat&env=VITE_TEXT_GENERATION_BASE_URL,VITE_TEXT_GENERATION_API_KEY,VITE_TEXT_GENERATION_MODEL,VITE_IMAGE_GENERATION_BASE_URL,VITE_IMAGE_GENERATION_API_KEY,VITE_IMAGE_GENERATION_MODEL&envDescription=AI%20API%20配置)
|
|
|
+
|
|
|
+### Netlify 部署步骤
|
|
|
+
|
|
|
+1. **Fork 项目**到你的 GitHub 账户
|
|
|
+2. **登录 Netlify**并连接 GitHub
|
|
|
+3. **新建站点**:选择 fork 的仓库
|
|
|
+4. **构建设置**:
|
|
|
+ - Build command: `npm run build:netlify`
|
|
|
+ - Publish directory: `dist`
|
|
|
+ - Node version: `18`
|
|
|
+5. **环境变量**:在 Netlify 站点设置中添加环境变量
|
|
|
+6. **部署**:Netlify 会自动构建和部署
|
|
|
+
|
|
|
+或者使用一键部署:
|
|
|
+[](https://app.netlify.com/start/deploy?repository=https://github.com/liu-ziting/what-to-eat)
|
|
|
+
|
|
|
+## 🔍 获取 Netlify Site ID
|
|
|
+
|
|
|
+要获取 Netlify 部署状态徽章,需要找到你的 Site ID:
|
|
|
+
|
|
|
+1. 登录 Netlify 控制台
|
|
|
+2. 选择你的站点
|
|
|
+3. 进入 **Site settings** > **General**
|
|
|
+4. 在 **Site information** 中找到 **Site ID**
|
|
|
+5. 将 README 中的 `your-site-id` 替换为实际的 Site ID
|
|
|
+
|
|
|
+## 🛠️ 自定义域名
|
|
|
+
|
|
|
+### Vercel 自定义域名
|
|
|
+
|
|
|
+1. 在 Vercel 项目设置中选择 **Domains**
|
|
|
+2. 添加你的域名
|
|
|
+3. 按照提示配置 DNS 记录
|
|
|
+
|
|
|
+### Netlify 自定义域名
|
|
|
+
|
|
|
+1. 在 Netlify 站点设置中选择 **Domain management**
|
|
|
+2. 添加自定义域名
|
|
|
+3. 配置 DNS 记录或使用 Netlify DNS
|
|
|
+
|
|
|
+## 🔄 自动部署
|
|
|
+
|
|
|
+两个平台都支持 Git 集成的自动部署:
|
|
|
+
|
|
|
+- **推送到主分支**:自动触发生产环境部署
|
|
|
+- **推送到其他分支**:创建预览部署(Vercel)或分支部署(Netlify)
|
|
|
+- **Pull Request**:自动创建预览部署
|
|
|
+
|
|
|
+## 📊 监控和分析
|
|
|
+
|
|
|
+### Vercel Analytics
|
|
|
+
|
|
|
+- 在项目设置中启用 Vercel Analytics
|
|
|
+- 查看页面性能和用户访问数据
|
|
|
+
|
|
|
+### Netlify Analytics
|
|
|
+
|
|
|
+- 升级到付费计划以使用 Netlify Analytics
|
|
|
+- 查看流量统计和性能指标
|
|
|
+
|
|
|
+## 🚨 故障排除
|
|
|
+
|
|
|
+### 常见问题
|
|
|
+
|
|
|
+1. **构建失败**:检查环境变量是否正确配置
|
|
|
+2. **页面 404**:确保 SPA 重定向规则已配置
|
|
|
+3. **API 调用失败**:检查 API 密钥和端点配置
|
|
|
+4. **静态资源加载失败**:检查构建输出目录配置
|
|
|
+
|
|
|
+### 调试步骤
|
|
|
+
|
|
|
+1. 查看构建日志
|
|
|
+2. 检查环境变量配置
|
|
|
+3. 本地测试构建命令
|
|
|
+4. 检查网络和 API 连接
|
|
|
+
|
|
|
+## 📞 支持
|
|
|
+
|
|
|
+如果遇到部署问题,可以:
|
|
|
+
|
|
|
+1. 查看项目 Issues
|
|
|
+2. 参考官方文档:
|
|
|
+ - [Vercel 文档](https://vercel.com/docs)
|
|
|
+ - [Netlify 文档](https://docs.netlify.com/)
|
|
|
+3. 提交新的 Issue 描述问题
|