分享发现 我的 Vibe Coding 的第一个项目
大家好，我是 Immerse，一名独立开发者、内容创作者。
- 关注公众号：# 沉浸式趣谈，获取最新文章（更多内容只在公众号更新）
- 个人网站：
https://yaolifeng.com也同步更新。 - 转载请在文章开头注明出处和版权信息。
我会在这里分享关于编程、独立开发、AI干货、开源、个人思考等内容。
如果本文对您有所帮助，欢迎动动小手指一键三连 (点赞、评论、转发)，给我一些支持和鼓励，谢谢！
作为一名开发者，大家都会面临长时间 Coding 忘记休息，忘记喝水。我们也都知道这其中的危害，但在工作中却很难自觉地执行这些健康习惯。已经有多位同事因长期久坐出现肾结石等健康问题。
基于这个真实的小痛点，尝试用 Vibe Coding 方式开发一个健康提醒插件
Health Reminder：一个极简的 VS Code 插件，提供久坐和喝水的强制提醒功能。
这个项目的价值不仅在于插件本身，更在于展示如何利用 AI 从零开始快速构建有实际应用价值的工具。
GitHub：https://github.com/yaolifeng0629/Health-Reminder 插件市场：https://marketplace.visualstudio.com/items?itemName=Immerse.health-reminder
Vibe Coding 开发全流程详解
Vibe Coding 是什么？
可以直接翻译为 “氛围编程”，不是简单的让 AI 按照你的命令去写代码，而是结合你的规划、直觉和迭代的一种新型开发方式。
但我个人觉得它是一种通过自然语言与 AI 共同协作完成编程任务的一种新的开发方式。不同于之前的的" Ctrl C、V 代码片段"，它更像是你与一个资深的开发小伙伴结对编程，只不过这个小伙伴变成了 AI。
下面我会分享初次体验 Vibe Coding 这个开发流程
1. Requirements & Plan
我用自然语言描述了核心功能，让 Gemini 2.5 Pro 帮我扩展和完善。
这个阶段的关键是将模糊的想法转化为结构化的功能需求。与之前不同的是，我不需要再写详细产品交互文档，只需要描述核心功能和使用的场景
你给我一款VSCode插件，其核心功能：久坐、喝水强制提醒。
**核心功能 (Core Functionality):**
1. **独立计时器 (Independent Timers):**
* **久坐计时器:** 跟踪上次提醒后或开始工作后的时间。
* **喝水计时器:** 跟踪上次提醒后或开始工作后的时间。
* **自动重置:** 每次提醒触发并被用户“确认”后，对应计时器自动重置。
2. **强制性全屏提醒弹窗 (Mandatory Full-Screen Reminder Pop-up):**
* 当任一计时器达到预设阈值时，自动在 VS Code/Cursor 界面上方弹出一个 **全屏或占据大部分屏幕、不可关闭** 的模态窗口。
* **UI 锁定:** 此窗口必须完全覆盖编辑器界面，并暂时禁用所有键盘输入和鼠标操作，直到用户进行互动。
* **提醒信息:** 窗口内显示明确、简洁的提醒信息：
* 久坐提醒时显示：“该起身活动了！”或“休息一下眼睛，伸展身体。”
* 喝水提醒时显示：“该喝水了！”或“补充水分，保持健康。”
* **强制确认按钮:** 窗口底部必须有一个明确的按钮，如“我知道了”、“已休息”或“已喝水”。用户 **必须点击** 此按钮，才能关闭弹窗、解除 UI 锁定，并重置相应的计时器。
* **（可选但推荐）短暂延迟:** 弹窗出现后，可在确认按钮激活前强制用户等待 3-5 秒，以确保提醒被注意到。
3. **极简配置 (Minimal Configuration):**
* 通过 VS Code/Cursor 的设置 (`settings.json`) 或图形化设置界面，仅提供以下关键配置项：
* **久坐提醒间隔 (Sit Reminder Interval):** 默认 60 分钟，可调整（单位：分钟）。
* **喝水提醒间隔 (Drink Reminder Interval):** 默认 45 分钟，可调整（单位：分钟）。
* **启用/禁用提醒 (Enable/Disable Reminders):** 可单独开启/关闭久坐提醒和喝水提醒。
这个步骤 AI 会根据扩展的功能需求，开始给我实现初步的功能代码。
2. Debug & Testing
直接按 F5 选择 VS Code Extension 启动调试，在新 VS Code 窗口中体验和测试功能。
3. 打包与发布
调试验证无误后，使用 vsce 工具打包插件：
npm install -g @vscode/vsce # 安装打包工具
vsce package # 打包插件
生成的 .vsix 文件就是插件安装包。
最后，在 VS Code Marketplace 上创建账号，然后发布插件。
整个过程出人意料地顺利。
Vibe Coding 体验心得
1. 角色的转变
传统开发中，需要在多个角色间切换：需求分析师、架构师、开发者、测试员等。而在 Vibe Coding 中，AI 能够同时扮演多个角色，让开发过程更加流畅。
2. 自然语言的局限
用自然语言描述需求和问题，对于一些小细节地方的处理可能还是不够完善，需要人为多次介入。
GitHub：https://github.com/yaolifeng0629/Health-Reminder 插件市场：https://marketplace.visualstudio.com/items?itemName=Immerse.health-reminder
其他好文推荐
搞定 XLSX 预览？别瞎找了，这几个库（尤其最后一个）真香！