tauri-vue：快速开发跨平台软件的架子，支持自定义头部UI拖拽移动和窗口阴影效果

阳光穿透心脏的1/2处 2023-10-14 20:55 19阅读 0赞

## Tauri + Vue + Typescript ##

一个使用 tauri+vue+ts 开发跨平台软件的模板，支持窗口头部自定义 UI 和拖拽和窗口阴影，不用再自己做适配了，拿来即用，非常 nice。而且已经封装好了 tauri 的 http 请求工具，省去很多弯路。开源地址：[GitHub - Sjj1024/tauri-vue: 一个使用tauri和vue开发跨平台软件的架子][GitHub - Sjj1024_tauri-vue_ _tauri_vue]

使用到的技术栈：  
tauri：必须要用到的  
vue：前端页面开发框架  
vue-router：路由页面跳转控制  
pinia：数据存储和共享  
element-plus：UI 页面渲染  
sass：样式编程  
node：v16.18.0 本地开发依赖

### 页面预览：登陆页和主页 ###

[![format_png][]][format_png 1]

[![format_png 2][]][format_png 2 1]

### 本地开发配置 ###

克隆到本地：

git clone https://github.com/Sjj1024/tauri-vue.git

安装依赖：

pnpm install

开发预览：第一次比较耗时和消耗电脑性能，因为要安装 tauri 依赖

pnpm develop

编译打包：打包为不同平台的安装文件

pnpm bundle

[GitHub - Sjj1024_tauri-vue_ _tauri_vue]: https://github.com/Sjj1024/tauri-vue
[format_png]: https://img-blog.csdnimg.cn/img_convert/b06ebf93050c0c001bfd170a7ff4fe47.webp?x-oss-process=image/format,png
[format_png 1]: https://camo.githubusercontent.com/132d87774f162b1dcf0111f812f4bffbd9395d61fc1c76766735433ab4732033/68747470733a2f2f63646e2e737461746963616c792e636f6d2f67682f313032346875696a69612f51696e674368756e4d65697a69406d61737465722f696d6167652e3172656575626166643276342e77656270
[format_png 2]: https://img-blog.csdnimg.cn/img_convert/63c82aa45514847fcf47553a5b3a86e5.webp?x-oss-process=image/format,png
[format_png 2 1]: https://camo.githubusercontent.com/01abacc1ef2a6c6384c0bba8fc994b00e56c3cca7e7050b9ef226ba5265c5145/68747470733a2f2f63646e2e737461746963616c792e636f6d2f67682f313032346875696a69612f51696e674368756e4d65697a69406d61737465722f696d6167652e787235736b7036386a336b2e77656270