发现最好的独立开发者工具 & 技术栈

这篇文章推荐了一系列浏览器插件开发学习资料，包括在线教程如Chrome官方插件开发文档、浏览器插件教程和浏览器插件实战，开源案例如ai-summarizer、Bookmark-HTMLizer和dev-go，视频教程如Make a Custom Browser Extension in 3 minutes，以及优秀项目elmo.chat。希望这些资料能够对你有所帮助，让你的插件开发之旅更加顺利。

chibat/chrome-extension-typescript-starter

MichaelYuhe/chrome-extension-starter 是一个基于 React、TypeScript、Vite 和 Tailwind CSS 的 Chrome 扩展程序启动模板。

wxt-starter

这是Chrome浏览器扩展的样板和启动器，使用wxt、React、Tailwind css、Shadcn ui和Typescript构建。支持暗模式和本地化。

这是一个用于创建Chrome扩展程序的模板，使用React和TypeScript构建。重点在于利用Vite(Rollup)和Turborepo提高构建速度和开发体验。

Extension 是一个无需配置、跨浏览器的扩展开发工具，支持 TypeScript、WebAssembly、React 和现代 JavaScript，专为实用性和快速原型设计而设计。

Vite Plugin Web Extension 是一个现代化的 Web 扩展开发工具，利用 Vite 提供快速的开发模式、框架支持、跨浏览器兼容性、清单文件验证以及 TypeScript 支持。

vitesse-webext 是一个为 WebExtension 提供快速开发基础的 Vite 启动模板，支持 Vue 3、TypeScript、UnoCSS 等现代前端技术。该模板提供了一个清晰的文件结构，包括弹出页面、选项页面和内容脚本等组件，以及开发和构建所需的脚本。开发者可以通过 GitHub 模板创建新的仓库，或者使用 npx degit 命令将其克隆到本地。

crxjs/chrome-extension-tools 是一个旨在简化 Chrome 扩展程序捆绑过程的工具库。

WXT 是一个开源的 Web 扩展框架，旨在加快 Chrome 扩展程序的开发速度，支持多种浏览器，包括 Chrome、Firefox、Edge、Safari 以及所有基于 Chromium 的浏览器。

Plasmo 提供了一个全面的框架，帮助开发者利用 React、Svelte 和 Vue 等现代前端技术构建浏览器扩展程序。它的特点包括自动创建 shadow DOM 以防止样式泄漏，提供专用的扩展程序运行时，以及实现快速迭代的实时重载和 React HMR 功能。Plasmo 还支持跨浏览器开发，允许开发者使用单一代码库针对不同浏览器进行定制。