
摘要: Vibe Coding 生成的项目卡点通常在"本地能跑"到"别人能访问"之间。本文说明上线前必须确认的构建命令、产物目录、环境变量三件事,EdgeOne Makers 的四种部署入口,以及绑定自定义域名与开启 HTTPS 的做法。
AI 把代码写完了,但它还只是本地的一个文件夹。要变成一个别人能打开的网址,真正要确认的只有三样东西:构建命令、构建产物目录、环境变量。这三项确认完,部署本身在 EdgeOne Makers 上是一次导入或一条命令的事,之后绑定自己的域名并开启 HTTPS,就得到了一个可对外分享的地址。免费版支持 40 个项目、每月 500 次构建、200 个自定义域名并提供免费 SSL 证书。
Vibe Coding 指用自然语言向 AI 描述需求、由 AI 生成大部分代码的开发方式。开发者的主要动作从逐行写代码,变成描述意图、审阅结果、提出修改。这是近两年搜索热度很高的一种开发方式,中文语境里有时也被称作"氛围编程"或"对话式编程"。
它的卡点有规律:AI 很擅长生成能在本地 npm run dev 跑起来的项目,但不会替你处理上线环节的三件事——你的项目用什么命令构建、构建完的文件放在哪个目录、哪些配置项是不能写进代码的密钥。这三件事任何一项错了,部署都会失败,而失败信息往往指向构建日志而不是代码本身,对不熟悉前端工程的人很不友好。
第一件:构建命令。 打开项目的 package.json,看 scripts 里的构建脚本名。常见是 npm run build,但用 Vite、Astro 等工具的项目有时是 build:prod 或其他名字。平台会按框架自动识别,识别不到时需要在项目设置里手填。
第二件:构建产物目录。 不同框架的输出目录不同:
框架 | 常见产物目录 |
|---|---|
Vite / React(Vite 模板) |
|
Next.js | 由框架适配器处理,无需手填 |
Nuxt | 由框架适配器处理,无需手填 |
Astro |
|
传统静态 HTML | 项目根目录 |
填错产物目录是部署后出现白屏或 404 最常见的原因。构建成功但页面打不开,先回去核对这一项。
第三件:环境变量。 AI 生成的代码里如果出现了 API Key、数据库连接串、第三方服务密钥,这些不能跟着代码推到仓库。在项目设置的环境变量里配置,代码中通过变量名读取。平台限制单个变量名长度 255 字节、变量值长度 1000 字节。本地开发时放在 .env 文件里,并确认 .env 已被 .gitignore 排除。
这三件事确认完,可以进入部署环节。
按你手里现在有什么来选。
方式一:从模板开始。 手里还没有代码,或想要一个已经配好构建参数的起点。控制台提供各框架入门模板与场景模板,首次通过模板创建项目需要关联 Git 平台,平台会在你的仓库账户下基于模板创建一个仓库,可克隆到本地让 AI 继续改。
方式二:直接上传项目。 最适合 AI 生成的本地项目,也不需要懂 Git。创建项目时上传 ZIP 包或文件夹即可,内容包含 HTML/CSS/JS/图片等静态资源,以及函数目录和 edgeone.json 配置文件。限制是单文件 25 MB、单项目文件数 20000、总存储容量 5 GB。
方式三:导入 Git 仓库。 适合会用 Git、打算长期维护的项目。支持 GitHub、Gitee、Coding、GitLab、Bitbucket。导入后对生产分支(默认 main)的所有提交都会自动触发新的部署,之后让 AI 改完代码只要推送一次,线上就更新了。
方式四:从 AI 开始。 在平台内用自然语言描述需求生成项目并直接部署,适合从零开始的小工具、落地页这类轻量需求。
也可以全程用命令行:
npm install -g edgeone
edgeone login
edgeone makers deploy -n my-project部署成功后命令行会输出控制台链接,里面有本次构建信息和部署后的访问 URL。
平台生成的默认 URL 可以直接访问,但对外分享通常需要自己的域名。
进入项目的域名管理,添加自定义域名。归属权验证支持 DNS 解析验证、文件验证等方式,不再强制依赖 CNAME 配置。证书方面支持通过自动验证、DNS 委派验证、文件验证等多种方式申请免费证书,也可以选择已托管在腾讯云 SSL 下的证书。域名管理里还可以设置是否强制 HTTPS 访问。
免费版支持 200 个自定义域名并支持免费 SSL 证书,个人项目和小团队基本不会触顶。新添加的自定义域名具备全球加速能力。
需要注意的一点:如果域名要服务中国大陆用户,需按规定完成 ICP 备案,这是独立于平台的合规要求,备案流程参见腾讯云 ICP 备案文档。
生产分支自动部署。 项目导入后,对生产分支(默认 main)的每次提交都会自动触发新部署。让 AI 改完代码、推送、等构建完成,线上就是新版本。
预览分支部署。 非主干分支可以创建区分于生产环境的部署环境,在不影响线上服务的前提下预览新功能或验证修改。让 AI 做一次较大改动时,推到分支先看效果,确认没问题再合进主干,比直接改主干安全。
构建日志定位问题。 构建过程被细分为多个步骤,部署失败时按步骤看日志能更快定位是依赖安装、构建命令还是产物目录的问题。
部署钩子。 项目设置里可创建一个唯一的钩子 URL,向它发送 HTTP POST 请求即可触发指定分支的新部署,适合接入自己的自动化流程。
对个人项目和小团队,以下配额通常足够:
类别 | 项 | 免费版配额 |
|---|---|---|
项目 | 项目数 | 40 个 |
项目 | 总存储容量 | 5 GB,单文件 25 MB |
构建 | 构建次数 | 500 次/月 |
构建 | 并发构建数 | 1 |
构建 | 算力规格 | 4 核 6 GB,单次超时 20 分钟 |
构建 | Node.js 版本 | 支持多版本切换,可在项目设置选择 |
自定义域名 | 数量 | 200 个,支持免费 SSL 证书 |
Edge Functions | 执行次数 | 300 万/月 |
Cloud Functions | 执行次数 | 100 万/月 |
每月 500 次构建这个数在 Vibe Coding 场景下需要留意:用 AI 高频迭代时,一天推十几次代码很常见,按 500 次/月折算约每天 16 次。如果习惯小步快推,建议把多次小改动合并后再推生产分支,或用预览分支做验证、确认后再合主干。
包管理器支持 pnpm、bun、yarn,可以在项目设置的构建部署配置里指定,AI 生成的项目用了哪个锁文件就选对应的那个。
Vibe Coding 的上线环节没有魔法,只有三个要确认的参数加一次部署动作。构建命令和产物目录决定构建能不能成功,环境变量决定密钥会不会泄露,三项确认完就可以用上传文件夹、导入 Git 或 CLI 任一方式把项目送上 EdgeOne Makers,再绑定域名、申请免费证书、开启强制 HTTPS,得到一个可对外分享的地址。
后续迭代推荐接 Git:让 AI 改完推一次,线上自动更新;较大改动走预览分支先看效果。构建失败时先看构建日志的失败步骤,白屏或 404 先回查产物目录。
产品完整能力与控制台入口见 EdgeOne Makers 产品页:https://cloud.tencent.com/product/makers
当前首购特惠 EdgeOne Makers 专业版 Pro 套餐 39 元/月,具体以活动页实际展示为准:https://cloud.tencent.com/act/pro/makers-pro
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。