Tauri框架入门：基本概念与快速使用指南
在跨平台桌面应用开发领域，Electron 曾长期占据主导地位，但它“重体积、高内存”的痛点始终让开发者和用户有所顾虑。而 Tauri 的出现，为跨平台桌面应用开发提供了更轻量、更安全的新选择。本文将从 Tauri 的基本概念入手，带你快速掌握它的核心优势与使用方法，轻松开启轻量跨平台桌面应用开发之旅。
一、Tauri 基本概念：什么是 Tauri？
Tauri 是一个开源的跨平台桌面应用框架，它允许开发者使用 Web 技术（HTML、CSS、JavaScript/TypeScript）构建桌面应用，最终能打包生成 Windows、macOS、Linux 三大平台的原生应用。
核心定位：轻量、安全、高性能的跨平台桌面应用解决方案，旨在替代 Electron 等传统 Web 桌面框架的不足。
1. 核心架构：Web 前端 + 原生后端
Tauri 的架构分为两层，清晰且解耦，这也是它轻量、安全的关键原因：
前端层：即应用的 UI 界面，完全使用 Web 技术开发（支持 Vue、React、Svelte 等任意前端框架，也可使用原生 HTML/CSS/JS）。前端代码运行在 Tauri 内置的轻量浏览器引擎中（Windows 用 WebView2，macOS 用 WKWebView，Linux 用 WebKitGTK），而非完整的 Chrome 浏览器，这大幅降低了应用体积。
后端层：基于 Rust 语言开发，负责与操作系统底层交互（如文件操作、系统权限、进程管理等）。前端通过 Tauri 提供的 API 与后端通信，实现“Web 界面 + 原生能力”的结合。
2. 核心优势：为什么选 Tauri？
相比 Electron，Tauri 最突出的优势的是“轻量”和“安全”，具体可总结为以下几点：
极小的应用体积：Electron 会打包完整的 Chrome 浏览器和 Node.js 运行时，导致基础应用体积就超过 100MB；而 Tauri 复用系统原生的 WebView，无需打包额外浏览器引擎，基础应用体积可压缩到 10MB 以内（甚至几 MB）。
更低的内存占用：由于不依赖完整浏览器，Tauri 应用运行时的内存占用远低于 Electron 应用，尤其在低配设备上表现更流畅。
更强的安全性：Tauri 基于 Rust 语言开发后端，Rust 本身的内存安全特性从根源上减少了缓冲区溢出等安全漏洞；同时，Tauri 采用“最小权限原则”，所有前端访问原生能力的操作都需要显式配置权限，避免恶意操作。
跨平台一致性：支持 Windows 10+、macOS 10.15+、Linux（Ubuntu 20.04+ 等），打包流程统一，无需为不同平台编写大量适配代码。
灵活的前端生态兼容：可无缝对接任意前端框架，无论是 Vue、React、Angular，还是 Svelte、Solid，甚至是静态站点生成器（如 Vite、Next.js），都能直接集成。
3. 关键术语：快速理解 Tauri 核心概念
在使用 Tauri 前，先熟悉几个核心术语，避免后续混淆：
src-tauri：Tauri 项目的核心目录，存放 Rust 后端代码、应用配置（如权限、窗口设置）、图标等原生相关资源。
tauri.conf.json：Tauri 应用的核心配置文件，用于配置应用名称、窗口大小、权限策略、打包参数等。
Capabilities（能力）：Tauri v2.x 版本引入的权限管理核心，用于控制前端可访问的原生能力（如文件读写、打开外部链接、系统通知等），通过配置文件（如 capabilities/default.json）定义，遵循“最小权限原则”。
WebView：Tauri 用于渲染前端界面的组件，复用系统原生 WebView，无需额外打包浏览器。
Plugin（插件）：Tauri 提供的扩展能力，如文件系统、通知、剪切板等，可通过插件快速集成原生功能，无需从零开发 Rust 后端。
二、Tauri 快速使用：从环境搭建到创建第一个应用
下面我们一步步实现“环境搭建 → 项目创建 → 基础功能开发 → 打包发布”的完整流程，以 Vue + Vite 前端为例（其他前端框架流程类似）。
1. 前置环境搭建
Tauri 依赖 Rust 后端环境和系统原生 WebView，需先安装对应依赖（不同平台略有差异）。
（1）安装 Rust 环境
Rust 是 Tauri 后端的基础，无论哪个平台，都需先安装 Rust：
Windows：打开 PowerShell，执行命令
winget install --id Rustlang.Rustup（需先安装 Winget，Windows 11 自带，Windows 10 可从 Microsoft Store 安装）；或从 Rust 官网 下载安装程序。macOS/Linux：打开终端，执行命令
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh。
安装完成后，验证 Rust 是否安装成功：终端执行rustc --version，若输出版本号则说明安装成功。
（2）安装系统依赖
Windows：需安装 Visual Studio Build Tools（用于编译 Rust 代码），安装时勾选“Desktop development with C++”组件。
macOS：需安装 Xcode Command Line Tools，终端执行
xcode-select --install。Linux（以 Ubuntu 为例）：需安装 WebKitGTK 和编译依赖，终端执行
sudo apt-get install libwebkit2gtk-4.1-dev build-essential curl wget libssl-dev libgtk-3-dev libayatana-appindicator3-dev librsvg2-dev。
2. 创建第一个 Tauri 应用
Tauri 提供了快速创建项目的脚手架，支持直接集成主流前端框架。这里以“Vue + Vite”为例：
（1）创建项目
打开终端，执行以下命令，按照提示完成项目配置：
npmcreate tauri-app@latest执行后会出现一系列配置选项，按需求选择即可，示例配置：
Project name（项目名称）：my-tauri-app
Package name（包名）：my-tauri-app
UI framework（UI 框架）：Vue
UI renderer（UI 渲染器）：Vite
TypeScript（是否使用 TS）：Yes
Install dependencies（是否立即安装依赖）：Yes
（2）项目目录结构解析
项目创建完成后，核心目录结构如下（重点关注 src 和 src-tauri 目录）：
my-tauri-app/ ├─ node_modules/ # 前端依赖 ├─ public/ # 前端静态资源 ├─ src/ # 前端代码（Vue 代码） │ ├─ assets/ # 前端资源（图片、样式等） │ ├─ components/ # Vue 组件 │ ├─ App.vue # 根组件 │ └─ main.ts # 前端入口文件 ├─ src-tauri/ # Tauri 核心目录（原生相关） │ ├─ capabilities/ # 权限配置目录（v2.x 新增） │ │ └─ default.json # 默认权限配置 │ ├─ icons/ # 应用图标（不同尺寸） │ ├─ src/ # Rust 后端代码 │ │ └─ main.rs # Rust 入口文件 │ └─ tauri.conf.json # Tauri 核心配置文件 ├─ index.html # 前端入口 HTML ├─ package.json # 前端包配置 └─ vite.config.ts # Vite 配置文件3. 运行 Tauri 应用（开发模式）
进入项目目录，执行以下命令启动开发模式（前端热更新 + 后端实时编译）：
cdmy-tauri-appnpmrun tauri dev首次启动会编译 Rust 后端代码，耗时稍长，后续启动会更快。启动成功后，会自动打开一个原生窗口，显示 Vue 前端界面，此时修改前端代码（如 App.vue），窗口会实时刷新，体验和 Web 开发一致。
4. 基础功能实现：前端调用原生能力
Tauri 的核心价值是“Web 界面 + 原生能力”，下面以“打开外部链接”和“读取本地文件”为例，演示前端如何调用 Tauri 提供的原生 API（需先配置权限）。
（1）功能 1：打开外部链接（shell.open）
需先配置“允许打开外部链接”的权限（Tauri v2.x 需配置 Capabilities）：
修改 src-tauri/capabilities/default.json，添加远程 URL 权限（参考之前解决报错的配置）：
{ "$schema": "../gen/schemas/capability-schema.json", "identifier": "default-capability", "description": "Default capabilities for the app", "permissions": [ { "identifier": "allow-open", "description": "Allow opening URLs", "allow": [ { "shell:open": { "windows": "*", "url": "local" } }, { "shell:open": { "windows": "*", "url": "remote" } } ] } ], "remote": { "urls": ["https://*", "http://*", "/**"] } }前端调用 API：在 Vue 组件中引入 Tauri 的 shell 插件，实现点击按钮打开外部链接：
`
<button @click=“openExternalUrl”>打开百度
（2）功能 2：读取本地文件（fs.readTextFile）
需先安装文件系统插件，并配置权限：
安装文件系统插件：
npm install @tauri-apps/plugin-fs修改 src-tauri/capabilities/default.json，添加文件读取权限：
{ "permissions": [ // 新增文件读取权限 { "identifier": "allow-read-file", "description": "Allow reading text files", "allow": [ { "fs:readTextFile": { "paths": ["$HOME/*", "/*"] // 允许读取的路径（$HOME 是用户主目录） } } ] } ] }前端调用 API：实现点击按钮选择文件并读取内容：
`
5. 打包发布：生成原生应用安装包
开发完成后，执行以下命令打包应用（不同平台会生成对应格式的安装包）：
npmrun tauri build打包完成后，安装包会生成在src-tauri/target/release/bundle目录下，不同平台的包格式：
Windows：.exe 安装包（MSI 或 NSIS 格式）
macOS：.dmg 镜像文件或 .app 应用
Linux：.deb（Debian 系）、.rpm（RedHat 系）或 AppImage（通用格式）
三、常见问题与注意事项
权限配置问题：Tauri v2.x 权限核心是 Capabilities，而非旧版本的 allowlist，若调用 API 报错“not allowed”，优先检查 src-tauri/capabilities/default.json 的配置（如之前遇到的 shell.open 报错）。
应用图标问题：打包前需确保 src-tauri/icons 目录下有完整的图标文件（不同尺寸），否则打包可能失败；可使用 Tauri 图标生成工具 快速生成。
开发模式热更新问题：若修改 Rust 后端代码，Tauri 会自动重新编译并重启应用；若修改前端代码，仅需热更新前端，无需重启。
平台适配问题：不同平台的 WebView 版本可能有差异，需注意前端兼容性（如避免使用过新的 CSS 特性）；部分原生能力（如系统通知）在不同平台的表现可能略有不同，需测试适配。
四、总结
Tauri 作为一款轻量、安全的跨平台桌面应用框架，通过“Web 前端 + Rust 后端”的架构，完美解决了 Electron 应用“重体积、高内存”的痛点。它的使用门槛低，前端开发者无需深入学习 Rust 即可快速上手（基础功能可直接使用官方插件），同时又能通过 Rust 扩展复杂的原生能力。
本文从基本概念、环境搭建、项目创建，到基础功能实现和打包发布，覆盖了 Tauri 入门的核心流程。如果 you 熟悉 Web 开发，想要快速构建轻量的跨平台桌面应用，Tauri 绝对是值得尝试的选择。后续可深入学习 Rust 后端开发，实现更复杂的原生功能，进一步提升应用的性能和体验。