在动手之前，先搞清楚两种部署方式的区别：

本地部署

• 项目运行在你自己的电脑上
• 电脑关了，服务就关了
• 下次使用需要重新启动
• 适合：自己用、测试功能

线上部署

• 项目放在一个永远不会关机的服务器上
• 任何人通过链接都能访问
• 适合：分享给别人、多设备使用

想自己用就选本地，想分享就选线上。两种方式今天都会讲到。

传统的本地启动方式是在终端输入 npm run dev，但这有两个问题：

• 路径问题：必须先 cd 进入项目目录才能启动
• 操作繁琐：需要命令行操作，项目多了端口还会冲突

更好的方式：让 AI 写一键启动脚本

在 Cursor 中打开一个新的对话窗口，发送以下指令：

帮我创建一个一键启动脚本，要求如下：
1. 自动检测端口并处理冲突
2. 同时启动项目的前后端
3. 所有服务启动就绪后，自动打开默认浏览器
4. 脚本上要注释使用方法
5. 脚本命名为「会议白板助手」
6. 脚本完成后，你先尝试启动运行一遍，确保 OK
7. 需要脚本自行 CD 到目标文件夹

Cursor 会生成一个 .bat（Windows）或 .sh（Mac）启动文件。以后直接双击这个脚本文件就能自动启动项目，不用再打开编辑器。

线上部署的第一步是把代码上传到 GitHub。你就把 GitHub 当成一个存代码的云盘。

注册 GitHub 账号

1. 打开 github.com
2. 点击注册，填写信息，过程很快

安装 GitHub Desktop

1. 打开 desktop.github.com
2. 点击 Download，下载对应你系统的版本
3. 安装完成后打开，点击登录你的 GitHub 账号

GitHub Desktop 是图形化工具，不需要用命令行操作。

找到项目文件夹

如果找不到项目文件夹的位置，可以在 Cursor 项目目录中任意文件上右键 → 点击 Reveal in File Explorer，进入文件管理器后点击上一级即可。

上传步骤

1. 打开 GitHub Desktop，将项目文件夹直接拖拽进去
2. 提示 Add Local Repository → 点击 Add Repository
3. 提示仓库在 GitHub 上不存在 → 点击 创建新仓库
4. 仓库信息保持默认，点击 创建
5. 点击 Publish your repository to GitHub → 点击 Publish 推送代码
6. 推送完毕后，点击 Open the repository page on GitHub in your browser 在浏览器查看

仓库默认是 Private（私有），只有你自己能看到，不用担心代码泄露。

关于 .env 文件

你会发现本地的 .env 文件（存储 API 密钥）没有被上传。这是正常且重要的安全机制——密钥相当于你的银行卡密码，绝对不能公开上传。后面的步骤会教你如何在线上安全配置。

代码上传完毕，接下来把它部署到线上。我们使用 Vercel 作为部署平台。

登录 Vercel

1. 打开 vercel.com
2. 点击 Continue with GitHub，用 GitHub 账号登录

导入项目

1. 点击 Add New → Add New Project
2. 点击 Import Git Repository
3. 找到你刚才上传的项目，点击 Import

构建部署

1. 其他设置都不用管，直接点击 Deploy
2. 等待 1-2 分钟自动构建
3. 构建完成后点击 Continue
4. 你会得到一个永久链接，格式为 项目名.vercel.app

这就是你的项目上线地址了！

打开 Vercel 提供的链接，你可能会发现功能不正常。这是因为 .env 文件没有被上传，线上缺少 API 密钥。

配置步骤

1. 回到 Vercel 项目控制台
2. 点击 Settings（设置）
3. 找到 Environment Variables（环境变量）
4. 点击 Add Environment Variable
5. 将 .env 文件里的字段名填入 Key，密钥值填入 Value
6. 点击 Save 保存
7. 提示需要重新部署 → 点击 Redeploy
8. 等待重新构建完成

重新部署后再打开链接，功能就正常了。

避坑指南：本地能用，线上不能用？十有八九就是环境变量没配置。这是新手最常见的线上踩坑，几乎每个人都会遇到一次。