来自哈迪斯的部署

发布: 0个月前 (2026年1月11日 GMT+8 06:34)

6 分钟阅读

I’m happy to translate the article for you, but I’ll need the full text of the post (excluding the source line you’ve already provided). Could you please paste the content you’d like translated? Once I have it, I’ll keep the source link unchanged and translate the rest into Simplified Chinese while preserving all formatting, markdown, and technical terms.

介绍

我来自那个每个人都在使用 Stack Overflow 的时代 😆。这是我构建我的作品集 版本 2 的故事，第一次尝试将其部署到 Google Cloud 时随之而来的混乱，以及我最终让它上线的过程。

第一次部署失败

在为我的 Google Cloud 项目创建 Dockerfile 后，我遇到了以下错误：

ERROR: (gcloud.run.services.update) The user‑provided container failed to start and listen on the port defined by the PORT=8080 environment variable within the allocated timeout. This can happen when the container port is misconfigured or if the timeout is too short. The health‑check timeout can be extended. Logs for this revision might contain more information.

这个错误耗费了我 5 小时 的时间，也让我认识到简单日志记录的重要性。

为什么我开始这个挑战

我的另一半一直在催我做开发挑战，我一直想用 React 和 three.js 背景重建我的网站。既然这是一个 Google AI 挑战，我决定深入这个技术栈。

我使用的工具

Antigravity – 一个内置 Google AI Studio 的升级版 VS Code。
Google Gemini – 用于故障排查和代码生成。

首次使用 Antigravity 的尝试

我给 Antigravity 以下提示：

“Download my website from https://www.madrigal.design, and redesign the website into a react.js stack. Clean up the website and modernize the code.”

结果是…… 糟糕透顶。我甚至没有截图，因为实在太差了。

第二次尝试 – 更好的起点

我再次运行了提示，这次在已经包含我原始代码的文件夹中。Antigravity 立刻生成了几乎可用的内容：

它首先使用 vanilla JavaScript 和 CSS 构建了项目——外观不错，但我想要 React。
我再次提示它将项目转换为 React，输出令人印象深刻，虽然有点臃肿。我随后删掉了多余的部分。

添加 Three.js 背景

我一直没有时间系统地学习 three.js，但我想要一个 粒子波动背景，颜色呈波纹式变化，保持简约。经过几次提示来调整颜色以匹配我的站点后，AI 生成了一个出乎意料地简洁实现。

我还使用 AI 将我的 “Creations & Projects” 部分改造成轮播，这让我快速了解 three.js 是如何集成的。

一点混乱（可选功能）

警告！
当时机到来时，按下 “停止混乱！” 按钮。

我添加了一个隐藏的“混乱”按钮以供娱乐。

第二次部署失败

在设置好 Google Cloud 后，我启用了 GitHub 持续部署，这样每次新的提交都会自动触发新的部署。

我再次遇到了和之前相同的错误：

ERROR: (gcloud.run.services.update) 用户提供的容器未能启动并监听 PORT=8080 定义的端口 …

我对 AI 的（误）信任

我求助于 Google Gemini，以为 Google 的产品能够快速解决 Google Cloud 的问题。经过多次提示和 13 次部署失败后，我最终停下来休息了 48 小时。

Debugging with Logs

当我返回时，我和我的合作伙伴一起检查了 Cloud Run 日志。我们注意到 Vite 构建不正确的问题，这是 AI 漏掉的。

已修复 Vite 构建错误。
Dockerfile 中调用 serve 的方式也有误。

纠正这些问题后，部署终于成功。

最终成功

服务已在 PORT=8080 上开始监听。
我通过 Google Cloud 的域映射将子域映射到 Cloud Run 服务。

DNS 解析完成后，新站点上线。

Takeaways

先阅读日志。 日志通常会直接指向根本原因。
AI 是一个有帮助的助手，而不是调试基础的替代品。
迭代式提示 可以生成优秀的代码，但要预期会有一些臃肿的代码，需要你自行清理。
容器端口配置 是 Cloud Run 失败的常见原因——务必确认你的应用监听的是由 PORT 环境变量提供的端口。

结束语

这个挑战提醒我，只要负责任地使用，AI 能加速学习和编码。它也再次强调了那句永恒的箴言：信任，但要验证——尤其是在日志大声呼喊需要关注时。

祝编码愉快，愿你的下次部署顺利！

I needed this update for myself, and it was enjoyable to play with new tools, new stacks, and do something different. Antigravity was a fun, juiced‑up version of VS Code to play with, and being able to produce a website with Three.js inside my editor in the stack I wanted was nice to try, see, and learn. I think the Three.js background is what really stood out to me in this rebuild. Thanks to the DEV community and their competitions for this.