littlebot
Published on 2025-04-17 / 4 Visits
0

【源码】基于 Vite 和 Vue 3 的 Chrome 扩展开发模板

项目简介

此项目是借助 Vite、Vue 3 以及 @crxjs/vite-plugin 搭建的 Chrome 扩展开发模板,为快速开发、构建和部署 Chrome 扩展提供基础工具与配置。

项目的主要特性和功能

  1. 采用 Vite 构建工具,拥有快速冷启动和即时热更新能力,便于开发者快速迭代与调试。
  2. 使用 Vue 3 框架,具备更佳性能、更灵活的组件选项和强大的开发工具。
  3. 运用 @crxjs/vite-plugin 插件,为 Vite 提供 Chrome 扩展开发特定功能,如自动注入背景页脚本和内容脚本、监听文件变化、优化打包以及支持 Chrome 扩展 API。

安装使用步骤

  1. 已下载本项目的源码文件。
  2. 在项目根目录下,运行 npm install 安装所有依赖。
  3. 运行 npm run dev 启动开发服务器,开始开发工作。
  4. 依据项目模板创建 Chrome 扩展,通过修改 src 目录下的文件添加业务逻辑和页面。
  5. 开发完成准备发布时,运行 npm run build 构建生产版本,生成可部署的扩展包。
  6. 按照 Chrome 扩展商店的指南,提交扩展进行发布。

注意:运行此项目需已安装 Node.js 和 npm,且熟悉 Vue.js 和 Chrome 扩展开发。该模板仅为起点,可能需根据具体需求进一步定制开发。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】