用 AI 打造属于自己的 Chrome 插件(零代码)
一直想要一个只做一件小事的 Chrome 插件?不用去学 JavaScript,把想法讲给 AI 编程 agent 听,就能拿到一个真正能装进浏览器的插件。
几乎每个人心里都有过一个「要是浏览器能帮我做这件事就好了」的念头。把网页里不想看的部分隐藏掉;加一个按钮,把当前页面一键复制成干净的纯文本;统计自己在某个容易分心的网站上到底耗了多久;自动填一张一天要重复填十遍的表单。这些正是 Chrome 插件的用武之地——而且现在已经不需要学 JavaScript 才能做出一个了。
有了 AI 编程 agent,你只要把想要的插件描述出来,它就会帮你写出真正能安装、能跑起来的代码。下面是具体做法。
Chrome 插件到底是什么(为什么 AI 特别擅长做这个)
Chrome 插件说白了就是浏览器加载进来的一小堆代码文件,仅此而已。正因为它体积小、自成一体、结构又很固定,所以是最适合让 AI 从头到尾独立完成的东西之一——不用起服务器,不用配置托管。你把这个文件夹做出来,加载进 Chrome,它就能用了。
这种「小而完整」的形态,恰好是 vibe coding(凭感觉描述、让 AI 直接建)最擅长发挥的地方:你只要说清楚一件事该干什么,很快就能拿到一个能跑的结果。
适合当第一个作品的插件点子
诀窍是挑一个足够小、足够具体的目标。下面几种效果都不错:
- 一键净化阅读按钮 —— 去掉文章里的广告和杂乱元素。
- 网页转文本复制器 —— 一键把当前页面复制成干净的纯文本。
- 网站拦截 / 计时器 —— 在某个网站上待够 X 分钟就提醒你该走了。
- 速记弹窗 —— 记一条和当前页面绑定的笔记。
- 表单自动填充器 —— 填那张你每天都要重复填的表单。
每一个都是「只把一件事做好」的小工具——非常适合当作第一个作品。
不写代码,怎么把它做出来
- 找一个能真正写代码的 agent。 你需要的是一个能在你电脑上真正写出代码、跑起来的工具,而不是一个只会甩代码片段给你看的聊天机器人。meshcode 就是这样一个原生的 Mac / Windows 应用。
- 把插件的需求说清楚。 描述得越清楚越好。与其只说「做个插件」,不如说:「做一个 Chrome 插件,在工具栏加一个按钮。点击后,把当前页面的正文内容——不要广告、不要菜单——复制到我的剪贴板,并弹出一个小小的『已复制』提示。」
- 让它把文件搭出来。 agent 会在你电脑上生成插件文件夹——manifest 配置文件加上实际代码。
- 加载进 Chrome。 打开
chrome://extensions,开启开发者模式,点「加载已解压的扩展程序」,选中那个文件夹。搞定——插件已经在你的浏览器里跑起来了。 - 继续用大白话打磨。 「把按钮改成蓝色。」「也把图片去掉。」你只管说想要什么,它会帮你改代码。
不用学语法,你只需要描述、检查、再微调。
说点实在话
- 越具体越好。 只说「做个插件」只会得到一团模糊的东西;把具体行为讲成清楚的一句话,才能得到真正能用的结果。把需求描述清楚,才是这里真正的技术含量。
- 在真实网页上测试。 点点按钮,多换几个网站试试,确认它做的确实是你想要的效果。
- 上架 Chrome 应用商店是另外一件事。 需要一次性的开发者费用和审核流程。如果只是自己用,「加载已解压的扩展程序」就够了——不用上架,也不用付钱。
为什么用 meshcode 做这件事
meshcode 在你自己的电脑上写出你真正拥有的真实代码——所以最终的插件就是一个普通的文件夹,你可以留着、继续改,或者以后交给开发者接手。没有平台锁定。它跑在全球编程 token 成本最低一档的模型栈上,而且是按量付费:充值 2-3 美元,做一个小插件也就是几分钱的事。
| 聊天机器人(ChatGPT/Claude 网页版) | meshcode | |
|---|---|---|
| 写出完整插件文件 | 只给代码片段,要自己拼 | 是——整个文件夹都给你 |
| 在你电脑上运行 | 否 | 是 |
| 代码归你所有 | 不适用 | 是,无锁定 |
| 起步成本 | 约 20 美元/月订阅 | 充值 2-3 美元(按量付费) |
| 适合非开发者 | 难 | 适合 |
挑一个你最想摆脱的浏览器小烦恼,用一句话描述清楚修复方案,今天下午就能把它做出来。
👉 下载 meshcode — Mac, Windows