Tauri是一组工具,可让您使用前端框架构建跨平台桌面应用程序。当与 React 和 Vite 结合使用时,它可以用于为所有桌面平台构建极其快速的二进制文件。
开发人员可以使用 Tauri 通过 Web 技术编写安全、精简和快速的跨平台桌面应用程序。对于许多开发人员来说, Electron通常是这些应用程序的首选框架,但 Tauri 现在已经做好了竞争的准备。
在这篇文章中,我们将构建一个简单的番茄钟计时器,我邀请您按照自己的节奏学习本教程。
它“非常快”(他们的话,不是我的话;但请点击链接查看基准并自行决定),因为它使用 Rust 作为后端(相对于 Node),生成更小的二进制文件,并且比 Node 更安全。
它使用底层操作系统提供的 WebView 来呈现应用程序的 UI——这是应用程序二进制文件更小的原因之一(与电子相比)。Tauri 工具包中的 WRY 库提供了一个统一的接口来与不同操作系统提供的 WebView 进行交互。WRY 库使用 Tao crate 进行跨平台窗口管理。
Tauri 将这一切结合在一起,使开发人员能够编写强大且高性能的桌面应用程序。
先决条件
在开始之前,我们需要安装一些东西。
锈
要安装 Rust,请打开终端并运行:
curl -- proto '=https' -- tlsv1 。2 - sSf https : //sh.rustup.rs | 嘘
如果您使用的是 Windows,请按照这些说明进行操作。
npm
npm 是 Node 的包管理器。它与 Node 捆绑在一起,所以如果你的系统上安装了 Node,你很可能也有 npm。
超过 20 万开发人员使用 LogRocket 来创造更好的数字体验了解更多 →
如果您没有 Node,请使用Homebrew安装它,
冲泡安装节点
安装好 npm 和 Rust 后,我们就可以开始使用 Tauri 开发应用程序了!
使用 create-tauri-app 搭建 Tauri 应用程序
由于现在已经安装了先决条件,我们可以开始开发我们的番茄计时器桌面应用程序。Tauri 的人们使用create-tauri-app npm 包使搭建应用程序变得超级简单。
要开始,请运行:
npx创建- tauri -应用程序
运行此命令后,您将需要输入一些信息:
-
项目名称
-
应用程序将在其中加载的窗口的标题
-
用户界面配方
-
要使用的模板
对于本教程应用程序,我使用了以下内容,如下所示
-
项目名称为pomodoro
-
窗口标题为Pomodoro Timer App
-
UI 配方为create-vite
-
要使用的模板react-ts
然后按Enter将安装所有必要的包,并在与项目名称相同的文件夹下输出一个脚手架项目。
我们现在都准备好第一次运行这个项目了!
来自 LogRocket 的更多精彩文章:
-
不要错过来自 LogRocket 的精选时事通讯The Replay
-
使用 React 的 useEffect优化应用程序的性能
-
在多个 Node 版本之间切换
-
了解如何使用 AnimXYZ 为您的 React 应用程序制作动画
-
探索 Tauri,一个用于构建二进制文件的新框架
-
比较NestJS 与 Express.js
-
发现TypeScript 领域中使用的流行 ORM
要运行项目,请运行:
cd pomodoro // cding到项目文件夹 npm run tauri dev //运行应用
这将首先启动前端服务器,然后将下载 crates(如果需要)并编译 Rust 后端。一旦编译没有任何错误,应用程序将启动,您将看到如下内容:
项目文件夹包含很多重要的文件和文件夹。我们将在本教程中处理的两个是:
-
src文件夹
-
src-tauri/tauri.config.json文件
首次运行该应用程序需要一些时间,因为该应用程序需要下载并编译必要的 rust crates。