vue开发插件实战

<1>vue初始化项目

vue create hello-chrome-vue

<2>删除不需要的文件

由于我们不是做完全的web 项目，vue-cli3 脚手架生成的文件，我们不是都需要， 这里就删除不必要的部分

src/main.js

src/components

src/App.vue

<3>安装chrome-ext插件依赖

我们需要修改项目使得 它适用于开发 Chrome 扩展只能使用 vue add chrome-ext 命令来安装，如果使用 yarn add chrome-ext 会发现项目没有任何改变。

这里的options对应的是这里：

<4>插件使用

打包：npm run build 会生成一个dist， 此文件夹可以直接放到Google浏览器中就行安装

说明：这里是一个工具，将我们的开发插件打包成crx结尾的压缩包，可以放到插件市场

更多学习视频学习资料请参考：B站搜索“我们一起学前端”  

我们一起学前端的个人空间_哔哩哔哩_Bilibili