Tauri 是一个开源的跨平台桌面应用程序开发框架,支持使用 Web 技术(如 HTML、CSS、JavaScript)和 Rust 编程语言编写本地桌面应用程序。它具有应用程序通用性高、体积小、性能强等特点,支持与现有 JavaScript 框架(如 React、Vue.js)及其生态系统相集成。Tauri 可以被用于开发各种类型的桌面应用程序,比如聊天客户端、音视频播放器、代码编辑器等,未来即将支持Android和IOS。
一、准备工作
- Vue需要安装nodejs;
- 安装pnpm,nodejs包管理器,直接在命令行执行
cargo install tauri-cli
即可; - Tauri是用Rust编写的,需要安装Rust;
- 安装Tauri命令行工具,直接在命令行执行
cargo install tauri-cli
即可; - (可选,但是推荐)安装源代码编辑器VSCode ,和VSCode插件 Volar + Tauri + rust-analyzer
二、从Tauri自带模板开始
- 从模板创建tauri程序,在命令行执行:
# 这个只需执行一次
cargo install create-tauri-app
再执行cargo create-tauri-app
命令,来创建 tauri app
F:\work>cargo create-tauri-app
✔ Project name · demo
✔ Choose which language to use for your frontend · TypeScript / JavaScript - (pnpm, yarn, npm)
✔ Choose your package manager · pnpm
✔ Choose your UI template · Vue - (https://vuejs.org)
✔ Choose your UI flavor · TypeScript
Template created! To get started run:
cd demo
pnpm install
pnpm tauri dev
命令行在创建出来的demo目录(刚才填的Project name是目录名),执行
pnpm i
更新依赖。继续执行命令,启动 Tauri 开发窗口
cargo tauri dev
。第一次运行此命令时,Rust 包管理器需要几分钟来下载和构建所有必需的包。 由于它们是缓存的,因此后续构建要快得多,因为只有新的代码需要重新构建。
一旦 Rust 完成构建,Web 视图就会打开,显示我们的 Web 应用程序。
- 尝试修改代码。打开
src/App.vue
,修改其中的 “Welcome to Tauri!”为“欢迎使用Tauri!”,保存即可看到结果。
- 打包发布App:
cargo tauri build
三、遇到问题
打包发布时出现错误:
F:\rauri\demo>cargo tauri build
Running beforeBuildCommand `pnpm build`
> demo@0.0.0 build F:\temp\rauri\demo
> vue-tsc --noEmit && vite build
vite v4.2.1 building for production...
✓ 21 modules transformed.
dist/index.html 0.46 kB
dist/assets/vue-5532db34.svg 0.50 kB
dist/assets/index-9848b876.css 1.40 kB │ gzip: 0.66 kB
dist/assets/index-e82703d4.js 56.96 kB │ gzip: 22.97 kB
✓ built in 1.71s
Compiling demo v0.0.0 (F:\temp\rauri\demo\src-tauri)
Finished release [optimized] target(s) in 17.32s
Info Verifying wix package
Downloading https://github.com/wixtoolset/wix3/releases/download/wix3112rtm/wix311-binaries.zip
Error failed to bundle project: `Io Error: 由于连接方在一段时间后没有正确答复或连接的主机没有反应,连接尝试失败。 (os error 10060)`
这个错误的出现是因为,tauri打包的过程中,会下载一个依赖包,国内由于GitHub慢原因,导致下载失败。解决办法是直接通过迅雷下载这个zip文件,然后将解压后的文件放到C:\Users\当前用户名\AppData\Local\tauri\WixTools
目录下,如果目录不存在需要手动创建对应的目录。
参考 juejin.cn/post/7183861675844436028
解决了这个错误后,还有类似的其他下载错误,下面是直接下载对应的目录:
https://github.com/tauri-apps/binary-releases/releases/download/nsis-3/nsis-3.zip
=> C:\Users\当前用户名\AppData\Local\tauri\NSIS
https://github.com/tauri-apps/binary-releases/releases/download/nsis-plugins-v0/NSIS-ApplicationID.zip
=> C:\Users\当前用户名\AppData\Local\tauri\NSIS\Plugins