基于 Vue3 + TypeScript + Manifest V3 的入门项目，使创建 Chrome 扩展变得非常容易 .
git clone https://github.com/cgxqd/chrome-extension-starter.git YOURFOLDERNAME
cd YOURFOLDERNAME
# Run npm install and write your library name when asked. That's all!
npm install|-- chrome-extension-starter
|-- gulpfile.mjs // 热更新逻辑
|-- public
| |-- manifest.json // 扩展配置文件
| |-- assets // 静态资源
|-- src
|-- background.ts // 后台脚本
|-- content_script.ts // 注入html脚本
|-- devtools // 控制面板配置页面
| |-- index.html
| |-- main.ts
|-- helper // 帮助
| |-- index.html
|-- options // 选项页面
| |-- App.vue
| |-- index.html
| |-- main.ts
|-- panel // 控制面板页面
| |-- App.vue
| |-- index.html
| |-- main.ts
|-- popup // 扩展程序弹层页面
| |-- App.vue
| |-- index.html
| |-- main.ts
|-- tools // 内置工具函数
|-- index.ts
|-- tool.type.ts
开始编码! 已经为您设置了 package.json 和入口文件，只需保持这些文件的名称相同即可。
- 零设置. 😉
- 热更新 使用 Gulp + Ws 模块实现
- Vite 用于遵循标准约定 Tree Shaking 的多个优化捆绑包
- Prettier 和 ESLint 用于代码格式和一致性
- git 挂钩 使用 Commitizen 和 Husky
npm start: 以监听方式启动项目npm run build: 打包项目npm run lint: Lints code
遵循 COMMIT 规范的 提交消息
已经设置了预提交和提交钩子，用于使用 Prettier 格式化代码 和 ESLint 代码检查 💅
安装 commitizen 辅助生成标准化规范
npm install -g commitizen
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent