随着 Web 技术的不断发展，构建跨平台桌面应用程序已成为越来越多开发者的选择。目前，Electron 是最广为人知的解决方案，但它体积较大，运行时占用资源多，往往不适合注重轻量化和高性能的场景。而 Tauri 作为一款新兴框架，凭借其小巧的打包体积和原生交互能力，逐渐获得了开发者的关注。
本文将带您了解 Tauri 的基本概念、如何快速上手，并通过一个简单的实例展示 Tauri 的使用方法。
什么是 Tauri？
Tauri 是一个为构建跨平台桌面应用程序而设计的框架。它允许开发者使用现有的前端技术（如 React、Vue、Svelte 等）构建应用程序的 UI，然后通过 Rust 编写后端逻辑，从而实现高效的桌面应用。
核心特点
-
轻量化
-
打包后的应用程序体积通常仅为几兆。
-
相比 Electron，Tauri 的内存占用显著降低。
-
-
安全性
-
默认配置具有强大的安全策略，例如内容安全策略（CSP）。
-
使用 Rust 的安全特性，减少常见的内存漏洞问题。
-
-
跨平台支持
- 支持 Windows、macOS 和 Linux。
-
前后端分离
- UI 使用 Web 技术，逻辑层使用 Rust，从而提升应用性能。
快速开始
接下来，我们将通过一个简单的 Tauri 项目来体验其强大之处。
环境准备
在开始之前，请确保已安装以下工具：
-
Node.js：用于前端开发。
-
Rust 工具链 ：通过 Rust 官网 安装。
-
Tauri CLI：Tauri 提供的命令行工具。
安装 Tauri CLI：
cargo install tauri-cli创建 Tauri 项目
-
初始化前端项目： 您可以选择使用任何前端框架，这里以 Vite + Vue 为例：
npm create vite@latest tauri-demo --template vue cd tauri-demo npm install -
添加 Tauri 模块： 在项目目录下运行以下命令：
npm install --save-dev @tauri-apps/cli @tauri-apps/api -
初始化 Tauri 项目：
npx tauri init此命令会自动在项目中生成
src-tauri目录，其中包含 Tauri 的配置文件和后端代码。
配置 Tauri
src-tauri/tauri.conf.json 是 Tauri 的主要配置文件，您可以在其中调整应用程序名称、窗口大小等参数。例如：
{
"package": {
"productName": "Tauri Demo",
"version": "0.1.0"
},
"tauri": {
"windows": [
{
"title": "Tauri 应用",
"width": 800,
"height": 600
}
]
}
}构建简单的 Tauri 应用
修改前端代码
在 src/App.vue 中添加一个按钮和事件绑定：
<template>
<div>
<h1>欢迎使用 Tauri</h1>
<button @click="greet">向后端发送请求</button>
</div>
</template>
<script>
import { invoke } from '@tauri-apps/api';
export default {
methods: {
async greet() {
const response = await invoke('greet', { name: 'Tauri 用户' });
alert(response);
}
}
};
</script>添加 Rust 后端代码
在 src-tauri/src/main.rs 中，定义一个简单的后端接口：
#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
use tauri::command;
#[command]
fn greet(name: &str) -> String {
format!("你好, {}! 这是来自 Rust 后端的消息。", name)
}
fn main() {
tauri::Builder::default()
.invoke_handler(tauri::generate_handler![greet])
.run(tauri::generate_context!())
.expect("failed to run app");
}运行应用程序
开发模式下启动应用：
npm run tauri dev此时，您会看到一个桌面应用程序窗口，并且点击按钮时能够弹出由 Rust 后端返回的消息。
打包应用程序
准备将应用程序发布到生产环境时，可以运行以下命令：
npm run tauri build打包后生成的安装文件位于 src-tauri/target/release/bundle 中。
更高级的功能
Tauri 还支持许多高级功能，包括但不限于：
-
文件系统访问：读写本地文件。
-
多窗口管理：在应用中创建多个窗口。
-
自定义菜单和托盘图标。
-
与操作系统交互，如剪贴板操作和通知。
以下是一个访问文件系统的示例：
#[command]
fn read_file(path: &str) -> Result<String, String> {
std::fs::read_to_string(path).map_err(|err| err.to_string())
}您可以通过前端的 invoke 方法调用此接口，并将结果显示在应用中。
对比 Electron
| 特性 | Tauri | Electron |
|---|---|---|
| 应用体积 | 几 MB | 数十到几百 MB |
| 内存占用 | 较低 | 较高 |
| 安全性 | Rust 提供内存安全保障 | 无内置保障，依赖开发者 |
| 开发语言 | 前端（任意） + Rust | 前端（任意） + Node.js |
结论
Tauri 是构建轻量级桌面应用程序的出色工具，尤其适合需要性能和体积兼顾的场景。它结合了现代 Web 技术与 Rust 的强大能力，为开发者提供了一种高效、可靠的开发体验。如果您正在寻找 Electron 的替代方案，不妨试试 Tauri。
欢迎分享您的开发心得或遇到的问题！