分享一个开箱即用的utools插件开发模板🍟

utools-plugin-template

今天给大家带来一个开源的utools插件开发模板,让你更快的开发一个属于自己的utools插件

为什么用模板

因为模板可以帮助我们更快的开发,并且减少一些重复的配置工作,大大提高开发效率

这个模板也是我在开发utools插件时,萌生出的一个想法,因为当时我想开发一个插件的时候并没有一个基础模板,我得从官方开发者模板中一步一步的新建文件,并配置一些字段信息,这个过程显得有点繁琐,而且可能会出错的概率

模板界面

模板功能

  • 🌈 开箱即用的Vite+Vue3Utools插件开发模板
  • ⚡ 开发环境自动注入HMR字段
  • 🦍 自动构建upx
  • 🧸 构建utools/preload文件,处理第三方依赖
  • 🚀 构建桌面应用

模板使用

这个模板的使用也是很简单的,你只需要将这个模板克隆下来,并安装依赖,然后就可以开始开发自己的插件了

bash 复制代码
git clone https://github.com/QC2168/utools-plugin-template
cd utools-plugin-template
npm install

接下来,你只需要配置一些关于你的插件信息就可以了

由于涉及到比较多图片简介,这里就不一一贴出来了(详细见readme.md

集成Electron

在开发这个模板的过程中,也收集了一些用户反馈,有些开发者希望开发插件时,同时也能构建一个exe文件

所以这个模板集成了Electron的开发环境,可以让你更快的开发插件,并且可以直接打包成exe文件,让你的插件更加的方便使用

在开发/构建的时候,你只需要执行一条命令即可😜

bash 复制代码
# 本地开发
npm run dev:electron
# 构建应用
npm run build:electron

electron集成部分使用了caoxiemeihao大佬的vite-plugin-electron插件来实现 🌹

这个是当项目运行electron时的开发界面

模板功能实现

模板中的一些功能实现,实际上是依靠模板中的@qc2168/vite-plugin-utools插件实现的,也即是如果你想要模板中的功能也可以通过安装插件的方式在你的项目中实现(不包含electron部分)

这个也是因为在我开发utools插件时,踩的一个坑后开发出来的,最起初的目的是解决第三方依赖丢失问题

到后面在写模板时,又新增了插件热更新,插件打包等功能

插件仓库地址:vite-plugin-utools

最后

希望这个模板能够帮助到你,如果有什么问题,欢迎提issue,我会尽力的解答你的问题

如果这个模板对你有帮助,请给这个项目点一个⭐️,谢谢!

模板仓库地址:utools-plugin-template 插件仓库地址:vite-plugin-utools

相关推荐
x-cmd1 小时前
[x-cmd] jsoup 1.22.1 版本发布,引入 re2j 引擎,让 HTML 解析更安全高效
前端·安全·html·x-cmd·jsoup
天下代码客1 小时前
使用electronc框架调用dll动态链接库流程和避坑
前端·javascript·vue.js·electron·node.js
weixin199701080162 小时前
【性能提升300%】仿1688首页的Webpack优化全记录
前端·webpack·node.js
冰暮流星2 小时前
javascript之数组
java·前端·javascript
晚霞的不甘2 小时前
Flutter for OpenHarmony天气卡片应用:用枚举与动画打造沉浸式多城市天气浏览体验
前端·flutter·云原生·前端框架
xkxnq2 小时前
第五阶段:Vue3核心深度深挖(第74天)(Vue3计算属性进阶)
前端·javascript·vue.js
三小河3 小时前
Agent Skill与Rules的区别——以Cursor为例
前端·javascript·后端
Hilaku3 小时前
不要在简历上写精通 Vue3?来自面试官的真实劝退
前端·javascript·vue.js
三小河3 小时前
前端视角详解 Agent Skill
前端·javascript·后端
Aniugel3 小时前
单点登录(SSO)系统
前端