lhzhou180606 / chrome-extension-v3-antd-react-template

使用Chrome Extensions API v3 开发源码模板。内置react18+antd5+TS

chrome-extension-v3-antd-react-template

Chrome Extensions Version 3.0

谷歌浏览器插件第三版API开发 源码模板。

使用了最新的工程化开发流程：

技术选型：

React 18
React Router V6
AntDesign 5
TypeScript
Chrome Extensions V3

Warning： 因为用的是v3版本的api, 所以Chrome版本必须大于97，否则不兼容。

预览图

使用方法

1. 克隆项目：

git clone https://github.com/jsoncode/chrome-extension-v3-antd-react-template.git

2. 进入到项目根目录

cd chrome-extension-v3-antd-react-template

3. 安装依赖

yarn install

4. 启动开发模式（会在根目录生成一个/build目录）

yarn devAndWatchPublic

编译和安装插件

发布编译：会在根目录生成一个/build目录和一个build.zip

yarn buildAndPack

1. 打开浏览器插件管理页面

2. 开启开发模式

3. 加载已解压的扩展插件

   

4. 选择项目根目录下，刚生成的build目录，点击确定，即可安装成功。

   

5. 就可以在地址栏右侧看到安装好的插件，点击这里，就可以进入预览效果了。

   

其他资料

Ant Design 文档

Chrome插件开发英文文档V3

Chrome插件开发中文文档V3