不会编程怎么用AI开发Chrome插件?从零搭建拼多多批量开票工具的完整复盘

**一句话结论:**用AI做一个能用的Chrome插件,不是"说一句话就完事了"。它更像你跟一个很聪明但不太了解你具体场景的工程师合作------你得把需求拆得足够细、把报错信息喂得足够清楚、在它跑偏的时候及时纠正。能做出来,但过程没有网上说的那么轻松。

我用了什么AI工具

最开始我用了几个免费的AI编程工具,体验一言难尽。有的生成了一段代码之后你让它改,它把之前对的也改了。有的跟你说"好的我理解了"然后给你一段完全无关的东西。

后来换到 Claude Code,在 VSCode 里跑的,它可以读整个项目的文件结构,理解上下文。这个区别很大------之前的工具每次对话都像重新认识你,Claude Code 能记住之前改过什么,不会把上一步修好的东西搞坏。我还配了一个 CLAUDE.md 文件放在项目目录里,里面写清楚了这个插件的架构、通信方式、注意事项------每次 AI 开始干活都会先读这个,相当于给了一个工作手册。

不管用哪个工具,关键是你要能描述清楚你要什么。不是技术描述,是行为描述。

怎么跟AI描述需求------这是最关键的技能

一开始我描述需求是这样的:"帮我做一个拼多多订单管理插件。"AI回了一大段------架构、技术栈、建议用的库------但代码跑不起来。

后来我学会了一种描述方式:**把一个操作拆成具体的步骤。**不是"帮我做个批量开票功能",而是:

"用户点击批量开票按钮后,系统需要依次打开每个勾选订单的发票申请页面URL。打开页面后等待3秒让页面加载,然后找到页面上的发票抬头填写区域,自动填入用户预设的抬头信息,然后找到提交按钮点击。提交成功后关闭当前标签页,继续处理下一个订单。"

这个描述AI就能理解。因为它知道了每一步要做什么,知道URL长什么样,知道等多久,知道成功和失败怎么判断。

说白了,**你得先搞清楚自己要做的事情在页面上是怎么一步一步走的,然后把每一步翻译成"先做什么→再做什么→遇到什么情况怎么办"。**不需要懂代码,需要懂流程。

改bug:最折磨人的部分

AI写的代码跑不起来,是最正常的事。跑起来了但结果不对,也很正常。

我的经验是:**把报错信息原封不动丢给AI。**浏览器按F12打开开发者工具,Console里会有红色报错------把那几行红字完整复制给AI,比你自己描述"好像有个错误"有效一万倍。AI看到具体的报错代码和行号,通常能秒定位。

如果AI给了修复方案但跑完又有新错误------很正常。再来。我的批量开票功能改了大概二三十轮才把主要流程跑顺。速度慢不是因为AI笨,是因为拼多多页面本身很复杂------有些按钮不是每次刷新都在同一个位置、有些页面加载时间不固定、有些订单状态会影响发票入口的显示。这些"例外情况"AI第一次写的时候不知道,跑起来遇到了才知道,遇到了再改。

这个过程累不累?累。但不比手工点发票累。手工点发票是每个月都要累一下午,改bug是累一次、以后不用再累了。

关于部署和发布

Chrome扩展开发模式下可以直接加载解压后的扩展文件夹。我一开始就是本地跑、自己用。后来几个同行看到了说也想用,我才做了打包。打包也不复杂------Chrome有个"打包扩展程序"按钮,点一下生成.crx文件。私自分发的话,用户打开开发者模式拖进去就行。如果要上架Chrome商店,需要开发者账号和审核流程,那个更复杂一些。

我现在用的是本地分发+官网下载的模式。用户从 duoduoke.net 下载,手动加载。这种方式不需要审核,但每次更新用户要自己重新加载。后续如果用户量再大一些,会考虑上架商店。

给也想用AI做工具的人

第一,先想清楚你要解决的问题是不是真的痛点。我做这个插件是因为我每个月被发票折磨,确定有需求。第二,把解决流程用纸笔写一遍------用户做什么、系统响应什么。第三,找一个能读项目上下文的AI工具。第四,准备好被折磨------改代码、报错、再改、再报错。第五,跑通了的那一刻,你会觉得之前所有折腾都值。

AI编程不是魔术。它是工具。工具好不好用,不取决于工具本身,取决于你愿不愿意花时间去跟它磨合。

常见问题

用AI开发插件需要学JavaScript吗?

不需要系统学,但建议了解最基础的概念------什么是变量、什么是函数、什么是DOM。花一两个小时看个入门视频就行,不用深。了解这些之后你能看懂AI给你的代码大概在干什么,出了问题也能描述得更准确。

Claude Code和Cursor有什么区别?选哪个?

两个我都用过。Cursor更像编辑器内置AI助手,适合在已有代码上改。Claude Code在VSCode里是命令行式的Agent,能读整个项目、自动执行命令、自己跑测试------适合从零开始搭项目。我做的过程中两个都用了,新功能开发用Claude Code,小修小改用Cursor。

做出来的插件怎么保证能长期维护?

拼多多页面改版是最担心的。我的做法是把核心逻辑和页面选择器分开------页面结构变了只需要让AI改选择器部分,不用动整个逻辑。CLAUDE.md里也记录了哪些模块依赖拼多多的哪些页面元素,改的时候AI知道往哪改。

你觉得普通人用AI做插件,最需要什么能力?

不是编程能力,是拆解问题的能力。你能把"我想批量开发票"拆成八个具体步骤,每步描述清楚输入和输出------AI就能帮你实现。你只说"帮我做个工具",AI帮不了。拆解能力决定了你的上限。

没写一行代码,成功演示:duoduoke.net