5 前端配置 on 编程那些事儿

6 Vite

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/vite/

Vite 是一个构建工具，致力于为现代 Web 项目提供更快、更精简的开发体验。本指南基于 Vite 8。

检查清单

在 src-tauri/tauri.conf.json 中使用 ../dist 作为 frontendDist。
在 iOS 真机上运行时，使用 process.env.TAURI_DEV_HOST 作为开发服务器的主机 IP。

示例配置

更新 Tauri 配置

7 Next.js

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/nextjs/

Next.js 是 React 的元框架。你可以在 https://nextjs.org 进一步了解 Next.js。本指南基于 Next.js 14.2.3。

检查清单

通过设置 output: 'export' 使用静态导出。Tauri 不支持基于服务器的方案。
在 tauri.conf.json 中使用 out 目录作为 frontendDist。

示例配置

更新 Tauri 配置

包管理器

8 Nuxt

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/nuxt/

Nuxt 是 Vue 的元框架。你可以在 https://nuxt.com 进一步了解 Nuxt。本指南基于 Nuxt 4.2。

检查清单

通过设置 ssr: false 使用 SSG。Tauri 不支持基于服务器的方案。
在 tauri.conf.json 中使用默认的 ../dist 作为 frontendDist。
使用 nuxi build 编译。
（可选）：在 nuxt.config.ts 中设置 telemetry: false 以禁用遥测。

示例配置

更新 Tauri 配置

包管理器

9 Qwik

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/qwik/

本指南将带你使用 Qwik Web 框架创建 Tauri 应用。你可以在 https://qwik.dev 进一步了解 Qwik。

检查清单

使用 SSG。Tauri 不支持基于服务器的方案。
在 tauri.conf.json 中使用 dist/ 作为 frontendDist。

示例配置

创建一个新的 Qwik 应用

包管理器

10 SvelteKit

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/sveltekit/

SvelteKit 是 Svelte 的元框架。你可以在 https://svelte.dev/ 进一步了解 SvelteKit。本指南基于 SvelteKit 2.20.4 / Svelte 5.25.8。

检查清单

通过 static-adapter 使用 SSG 和 SPA。Tauri 不支持基于服务器的方案。
如果使用带预渲染的 SSG，请注意在应用的构建过程中 load 函数无法访问 tauri API。推荐使用 SPA 模式（不带预渲染），这样 load 函数只会在 webview 中运行，并能访问 tauri API。
在 tauri.conf.json 中使用 build/ 作为 frontendDist。

示例配置

安装 @sveltejs/adapter-static

包管理器

11 Leptos

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/leptos/

Leptos 是一个基于 Rust 的 Web 框架。你可以在其官方网站进一步了解 Leptos。本指南基于 Leptos 0.6 版本。

检查清单

使用 SSG，Tauri 官方不支持基于服务器的方案。
设置 serve.ws_protocol = "ws"，以便移动端开发时热重载 WebSocket 能正常连接。
启用 withGlobalTauri，确保 Tauri API 可通过 window.__TAURI__ 变量使用，并可用 wasm-bindgen 导入。

示例配置

更新 Tauri 配置

12 Trunk

Fri, 25 Sep 2026 21:31:08 +0800

原文链接: https://tauri.app/start/frontend/trunk/

Trunk 是 Rust 的 WASM Web 应用打包工具。你可以在 https://trunk-rs.github.io/trunk/ 进一步了解 Trunk。本指南基于 Trunk 0.17.5。

检查清单

使用 SSG，Tauri 官方不支持基于服务器的方案。
设置 serve.ws_protocol = "ws"，以便移动端开发时热重载 WebSocket 能正常连接。
启用 withGlobalTauri，确保 Tauri API 可通过 window.__TAURI__ 变量使用，并可用 wasm-bindgen 导入。

示例配置

更新 Tauri 配置