搭建一个vite+vue+ts的Chrome插件开发模板
前言
最近在开发一个Chrome插件,在阅读官方文档时发现它提供的都是js的方式,完全没有工程化的概念,而且插件的版本已经到v3了,v3版本限制了非常多的东西,比如我们使用vue的template渲染,由于vue用到了eval
来实现,导致插件会报错,蛋疼的很,总不能写手写render函数吧,太累了。
最好的解决办法就是用vite来打包vue项目,这样既可以用vue组件的方式开发,打包时也会将template转换成render函数,从而避免了eval的报错,我们还可以使用到ts和scss这些便利的工具。
为此我们搭建一个开发模板需要实现以下功能:
- 支持vite打包
- 支持typescript
- 支持scss
- 支持pinia
- 支持vue-router
- 自动生成manifest.json文件
- 自动生成background.js文件
- 封装常用插件方法:message发布订阅、上下文菜单生成、浏览器消息通知、fetch请求等
此处内容已隐藏回复后方可阅读。
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿站点。未经许可,禁止转载。
全部评论 2
Joe
Google Chrome MacOS木灵鱼儿
FireFox Windows 10