使用Tauri快速搭建桌面项目

什么是 Tauri

Tauri 是一个跨平台的 GUI 框架，与 Electron 的理念相似。Tauri 的前端部分同样基于 Web 技术，但它的后端则采用了 Rust 语言。Tauri 可以创建体积更小、运行更快且更加安全的跨平台桌面应用。

与 Electron 不同，Tauri 并没有内置 Chromium，因此打包后的应用体积要比 Electron 小很多，启动速度更快，内存和 CPU 占用率也更低。

然而，由于没有内置 Chromium，Tauri 使用系统原生的 WebView 来渲染网页，这可能导致不同系统之间的页面表现存在差异。同时，Tauri 的后端需要使用 Rust 进行开发，这对前端开发人员来说可能会有一定的上手成本。

好在 Tauri 已经为我们封装了大部分 API，即使不懂 Rust，也可以开发出一款简单的应用。

预先准备

我们以 macOS 为例：

1. 首先安装 Xcode 命令行工具

在终端中执行以下命令：

xcode-select --install

如果已经安装过 Xcode 命令行工具，则可以直接进行下一步。

2. 安装 Rust

在 macOS 上安装 Rust，请打开终端并输入以下命令：

curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh

安装成功后，终端将显示以下内容：

Rust is installed now. Great!

请确保重新启动终端以使更改生效。

快速开始

创建项目

Tauri 官方提供了多种项目模板，可以快速搭建项目：

pnpm create tauri-app


npm create tauri-app


yarn create tauri-app

按照提示选择自己喜欢的模板。

这里我们选择 react 开发前端页面。

一路回车后，打开项目文件夹。执行安装依赖命令：pnpm i。依赖安装完成后，执行 pnpm tauri dev 命令启动项目。这时便会启动一个应用，如下图所示：

开发

Tauri 的开发非常容易上手，我们先来看下项目文件结构：

是不是和 Vite 的目录结构一样？

没错，这就是一个常规的 Vite 目录结构，唯一的区别是增加了一个 src-tauri 文件夹，这里面是 Rust 部分的代码，也就是后端代码。

打包

首先，我们需要修改默认的包标识符，位置在 src-tauri > tauri.conf.json > tauri > bundle > identifier。

这里我们随便填写一个标识符 com.example.app，保存，然后执行命令：pnpm tauri build 就可以正常打包了。

tauri.conf.json 文件是我们的应用配置文件，包含了应用的基本信息。

打包完成后，就可以在 tauri-app/src-tauri/target/release/bundle 目录下找到我们的应用。

现在我们只构建了 macOS 下的应用。

打开之后就可以看到我们的应用了。

参考文档