生成vue3项目

通过vue create app创建项目后，我们会发现仅仅只能用来开发web页面，如果要开发chrome插件，还需要手动配置下。

配置插件页面

chrome插件都有popup、devtools、options等页面，vue支持多页面，通过vue.config.js配置pages即可满足需求。

本质上这些页面和普通的web页面没有任何区别，但是我们可能需要在这些页面中调用chrome的相关api，为了能够顺利build，我们可以npm i @types/chrome来安装声明文件，同时也方便我们编写。

生成background.js，content.js

最麻烦的也是这里，如何单独生成这些js文件，这里我找到了插件

使用vue-cli-plugin-browser-extension可以快速的帮我们处理好background.js、content.js单独生成的问题，但是对于注入脚本的问题没有解决，我也提了个issues

同时还有其他解决办法
vue-cli-plugin-chrome-ex
vue-web-extension

好像vue-cli-plugin-browser-extension，对以上2个进行了融合

掘金上有篇文章，详细介绍了手动vue3搭建chrome插件项目的细节