零基础用Cursor开发浏览器插件：独立开发副业入门指南

从一个「抓狂瞬间」说起

你有没有过这样的体验：用惯了的浏览器插件突然下架，就像写报告时发现 Ctrl+C 突然失灵一样令人崩溃。

视频作者就遇到了这个问题——一个用于批量打开多个链接的浏览器插件突然消失了。但这次他没有干等，而是用 Claude + Cursor，仅凭一句 prompt 就做出了替代品。这个案例虽小，却完整展示了一个零基础小白如何借助 AI 工具开启独立开发的全过程。

实战：用AI开发一个浏览器插件

需求很简单，但细节不少

这个插件的核心功能看起来不起眼：用户按下 Z 键的同时拖拽鼠标，即可框选并批量打开多个链接。虽然功能简单，但在日常浏览网页时非常实用。

什么是浏览器插件？ 浏览器插件（Browser Extension）是基于 Web 技术（HTML、CSS、JavaScript）构建的小型软件程序，能够扩展浏览器的原生功能。Chrome 插件遵循 Manifest V3 规范，由 manifest.json 配置文件、content scripts（注入网页的脚本）、background service worker（后台服务）等核心文件组成。正是这种标准化的文件结构，让 AI 可以一次性生成完整可运行的插件代码，而无需开发者从零搭建项目骨架。

作者的开发流程分为几步：

1. 在 Claude 官网描述需求：先描述了鼠标拖拽选中框内所有链接的功能，后来发现需求不完整，又补充了「需要按下 Z 键同时拖拽」的交互方式。作者认为 Claude 官网的生成效果通常比直接在 Cursor 中调用更好，所以先在官网生成代码。

2. 在 Cursor 中落地代码：将 Claude 生成的代码转移到 Cursor，Cursor 会自动将代码拆分成本地的不同文件。这里涉及两个工具的明确分工：Claude 是 Anthropic 开发的大语言模型，擅长理解自然语言需求并生成高质量代码；Cursor 则是基于 VS Code 构建的 AI 代码编辑器，其 Agent 模式允许 AI 自主规划并执行创建文件、修改代码等多步骤任务。作为 AI Agent，Cursor 的每次操作都需要用户点击「接受」才会保存，确保你对每一步都有掌控。

3. 导入 Chrome 测试：打开 Chrome 插件商店的开发者模式，导入文件夹。如果导入失败，直接复制错误信息让 Cursor 修改即可。

最终成品还多了两个 AI 主动补充的交互细节：按下 Z 键后鼠标变成十字光标，以及首次使用时会有提示告知用户可以用这个交互来选中多个链接。这些小细节恰恰说明，即便是一个微小的需求，也有很多值得打磨的交互设计空间。

小白最大的误区：想太多，做太少

很多人一开始就陷入「我的目标用户是谁」「怎样让别人付费」这类思考，结果越想越复杂，眉毛胡子一把抓，最后完全不知道从何下手。

寻找需求的最佳起点，其实就是你自己的工作流。

关注日常中那些不顺手的小细节：可能是浏览器插件、可能是某个小工具、可能是某个重复操作。那些让你觉得「要是能这样就好了」的微小摩擦点，就是最好的切入点。

为什么推荐从小工具开始

填补无人维护的空白

像批量打开链接这种小工具，用着很好用但不赚钱。原作者可能因为各种原因下架了插件，你要等下一个人开发同样的东西，不知道得等到猴年马月。与其被动等待，不如自己用 AI 搓一个。这恰恰是 AI 辅助开发最适合的场景。

功能小，适合练手

小功能意味着复杂度可控。即使你不会开发、不懂代码，AI 也能帮你完成。不至于像做一个大型 APP 那样，遇到大量无法解决的问题却不知道症结在哪。

但即便是小项目，也能学到很多。比如作者发现，不同网页有不同的框架，有些 JavaScript 样式比较复杂，会导致插件无法识别链接、无法激活选择模式。这背后涉及一个重要的软件开发概念——Edge Case（边界情况）：不同网站使用 React、Vue、Angular 等不同前端框架，其 DOM 结构和事件处理机制各异，导致同一段 JavaScript 代码在某些页面失效。这正是专业 QA（质量保证）工程师存在的原因——系统性地覆盖各种边界场景。AI 目前能快速搭建「80分」的主流场景解决方案，但处理长尾的边界情况仍需要人工介入和反复迭代。生成一个覆盖普通搜索结果的程序很容易，但要覆盖各种边界情况，可能需要改十几遍还未必改得出来。这些都是做了才知道的东西，也是你了解 AI 工具局限性的最佳途径。

确保时间不被浪费

大家上班都很累，做副业像挤牙膏一样挤时间。从自己想要优化的小细节入手，即使暂时没有人为此付费，你也确实用这个小工具优化了自己的工作流。每次按一下 Z 然后拖一下鼠标，批量打开五六个链接，心里都会暗爽一下——「这可是我自己做的」。

培养「需求嗅觉」比写代码更重要

除了开发技能本身，这个过程更重要的价值在于培养你寻找需求的能力。你越是关注小细节、关注哪里使用不方便，就越能在日常生活中培养这种观察力：

• 「这个软件每次都要点三下才能到我想要的页面，好烦」
• 「为什么我每次都要手动整理这些数据」
• 「这个操作明明可以自动化，为什么没人做」

这些小抱怨，其实都是需求的种子。现在就可以开始培养自己观察并记录这些需求的习惯。

独立开发赚小钱的机会其实很多，赚中钱可能需要一定的运气、能力和认知，但赚小钱的门槛已经被 AI 工具大幅降低了。

给零基础开发者的行动建议

总结一下这套适合零基础开发者的起步方法论：

1. 不要眉毛胡子一把抓，先从优化自己工作中的小细节开始
2. 观察哪里不方便、哪里能更好，记录下这些微小的摩擦点
3. 尝试用 AI 工具（Claude + Cursor）把想法做出来，从小功能练手
4. 在实践中熟悉 AI 的能力边界，了解它擅长什么、在哪里会卡住
5. 逐步积累开发经验和需求嗅觉，为未来更大的项目打基础

在很多看似稳定的工作实际上已经不再稳定的今天，探索公司薪资之外属于自己的现金流，是一件值得认真对待的事情。与其等到被动应对，不如现在就从一个小插件开始行动。

核心要点

• 寻找开发需求的最佳起点是自己工作流中的痛点和摩擦点，而非一开始就思考商业模式
• 零基础用户可以通过 Claude 生成代码 + Cursor 本地落地的组合快速开发浏览器插件等小工具
• 小项目是了解 AI 工具能力边界的最佳途径，例如处理不同网页框架的 Edge Cases 仍是难点
• 从小工具练手既能优化自己的工作流，又能培养需求嗅觉和开发经验
• AI 工具已大幅降低独立开发门槛，赚小钱的机会很多，关键是立刻开始行动