案例一：自动分组浏览器 Tab
利用Cursor工具实现
第一次提示词：
# 角色:
你是一位资深程序员，能够熟练开发google浏览器插件。
# 目的:
我需要开发一个插件，用于将google浏览器的tab自动分组, 根据配置的域名自动分组。通过插件,如果用户打开过多的浏览器tab, 这样看着会比较混乱. 自动分组后, 会显得更加整洁和干净.
# 功能：
1. 点击插件, 可以输出需要设置的域名, 分组名称, 和分组的颜色, 颜色有(Blue、Red、Grey、Yellow、Green)
2. 点击保存后, 页面消失,显示“保存成功”
3. 当在浏览器打开对应域名的链接, 后台将自动根据分组名称,和颜色, 进行分组.
- 若打开新链接时,没有分组,则创建分组
- 若打开新链接时,已经存在相同域名的分组, 则自动合并
# 注意:
1. 注意使用 manifest v3 版本开发。
2. 注意中文编码的问题。
第二次提示词：
输入框中输入相应的提示，比如，请输入域名（www.example.com），请输入分组名称
第三次提示词：
域名可以泛指，比如 rdm.yfzx.965432.com、gxpt.yfzx.965432.com, 我输入的域名是*.yfzx.965432.com， 可以分为一组
第四次提示词：（如果生效了，可以忽略，不交互）
泛域名没有生效，比如我域名输入的是 *.yfzx.965432.com ，分组名称是Aisino， 但是rdm.yfzx.965432.com、gxpt.yfzx.965432.com 没有自动分组？
随便找三张图：
1729216968413.png
可以通过 iconfont 网址随便下载三个图表放入生成代码的目录，如下图：
1729217038738.png
Chrome插件加载目录，加载成功如下图：
1729217092854.png
效果：
1729217928010.png
完美
为了使插件更美观，增加了如下提示词，
提示词：
1、已保存的，增加一个编辑功能
2、弹窗整体宽度大一点，保证编辑按钮和删除按钮不换行
3、编辑按钮和删除按钮右对齐
4、域名输入还继续支持ip
效果如下图：
1729221601972.png
提示词
1、已保存的，增加一个按钮，上移下移，保持已实现的功能不变，也是右对齐
1729222117926.png
