Skip to content
Tauri 中文网
指南 手册 公告 🌐 Nodejs.cn

创建项目

Tauri 灵活的一个原因是它能够几乎与任何前端框架一起工作。我们创建了 create-tauri-app 工具，以帮助你使用官方维护的框架模板之一创建新的 Tauri 项目。

🌐 One thing that makes Tauri so flexible is its ability to work with virtually any frontend framework. We’ve created the create-tauri-app utility to help you create a new Tauri project using one of the officially maintained framework templates.

create-tauri-app 当前包含用于原生（不使用框架的 HTML、CSS 和 JavaScript）、Vue.js、Svelte、React、SolidJS、Angular、Preact、Yew、Leptos 和 Sycamore 的模板。你也可以在 Awesome Tauri 仓库 中找到或添加你自己的社区模板和框架。

或者，你可以将 Tauri 添加到现有项目，以快速将现有代码库转换为 Tauri 应用。

使用 create-tauri-app

Section titled “使用 create-tauri-app”

🌐 Using create-tauri-app

要开始使用 create-tauri-app，请在你希望设置项目的文件夹中运行以下命令之一。如果你不确定使用哪个命令，我们建议在 Linux 和 macOS 上使用 Bash 命令，在 Windows 上使用 PowerShell 命令。

🌐 To get started using create-tauri-app run one of the below commands in the folder you’d like to setup your project. If you’re not sure which command to use we recommend the Bash command on Linux and macOS and the PowerShell command on Windows.

sh <(curl https://create.tauri.app/sh)

按照提示选择项目名称、前端语言、包管理器和前端框架以及前端框架选项（如果适用）。

🌐 Follow along with the prompts to choose your project name, frontend language, package manager, and frontend framework, and frontend framework options if applicable.

搭建新项目

Section titled “搭建新项目”

🌐 Scaffold a new project

  1. 选择一个名称和一个打包标识符（应用的唯一 ID）：

    ? Project name (tauri-app) ›
    ? Identifier (com.tauri-app.app) ›

  2. 为你的前端选择一个风格。首先选择语言：

    ? Choose which language to use for your frontend ›
    Rust  (cargo)
    TypeScript / JavaScript  (pnpm, yarn, npm, bun)
    .NET  (dotnet)

  3. 选择一个包管理器（如果有多个可用）：

    TypeScript / JavaScript 的选项：

    ? Choose your package manager ›
    pnpm
    yarn
    npm
    bun

  4. 选择一个用户界面模板和风格（如果有多个可用的话）：

    Rust 的选项：

    ? Choose your UI template ›
    Vanilla
    Yew
    Leptos
    Sycamore

    TypeScript / JavaScript 的选项：

    ? Choose your UI template ›
    Vanilla
    Vue
    Svelte
    React
    Solid
    Angular
    Preact
    

    ? Choose your UI flavor ›
    TypeScript
    JavaScript

    .NET 的选项：

    ? Choose your UI template ›
    Blazor  (https://dotnet.microsoft.com/en-us/apps/aspnet/web-apps/blazor/)

完成后，该工具会报告模板已创建，并显示如何使用配置的包管理器运行它。如果它检测到系统中缺少依赖，它会打印出包列表并提示如何安装它们。

🌐 Once completed, the utility reports that the template has been created and displays how to run it using the configured package manager. If it detects missing dependencies on your system, it prints a list of packages and prompts how to install them.

启动开发服务器

Section titled “启动开发服务器”

🌐 Start the development server

在 create-tauri-app 完成后，你可以进入你的项目文件夹，安装依赖，然后使用 Tauri CLI 启动开发服务器：

🌐 After create-tauri-app has completed, you can navigate into your project’s folder, install dependencies, and then use the Tauri CLI to start the development server:

cd tauri-app
npm install
npm run tauri dev

你现在将看到一个新窗口打开，其中你的应用正在运行。

🌐 You’ll now see a new window open with your app running.

恭喜！ 你已经制作了你的 Tauri 应用！🚀

手动设置（Tauri CLI）

Section titled “手动设置（Tauri CLI）”

🌐 Manual Setup (Tauri CLI)

如果你已经有现有的前端或希望自己设置，则可以使用 Tauri CLI 单独初始化项目的后端。

🌐 If you already have an existing frontend or prefer to set it up yourself, you can use the Tauri CLI to initialize the backend for your project separately.

  1. 为你的项目创建一个新目录并初始化前端。你可以使用纯 HTML、CSS 和 JavaScript，或者你喜欢的任何框架，例如 Next.js、Nuxt、Svelte、Yew 或 Leptos。你只需要一种在浏览器中运行应用的方法。举个例子，这就是你如何设置一个简单的 Vite 应用的方法：

    mkdir tauri-app
    cd tauri-app
    npm create vite@latest .

  2. 然后，使用你选择的包管理器安装 Tauri 的 CLI 工具。如果你使用 cargo 来安装 Tauri CLI，你将必须全局安装它。

    npm install -D @tauri-apps/cli@latest

  3. 确定你的前端开发服务器的 URL。这是 Tauri 用来加载你的内容的 URL。例如，如果你使用 Vite，默认的 URL 是 http://localhost:5173。

  4. 在你的项目目录中，初始化 Tauri：

    npx tauri init

    运行命令后，它会显示一个提示，询问你不同的选项：

    ✔ What is your app name? tauri-app
    ✔ What should the window title be? tauri-app
    ✔ Where are your web assets located? ..
    ✔ What is the url of your dev server? http://localhost:5173
    ✔ What is your frontend dev command? pnpm run dev
    ✔ What is your frontend build command? pnpm run build

    这将在你的项目中创建一个 src-tauri 目录，其中包含必要的 Tauri 配置文件。

  5. 通过运行开发服务器验证你的 Tauri 应用是否正常运行：

    npx tauri dev

    此命令将编译 Rust 代码并打开一个包含你的 Web 内容的窗口。

恭喜！ 你已经使用 Tauri CLI 创建了一个新的 Tauri 项目！🚀

后续步骤

Section titled “后续步骤”

🌐 Next Steps

Tauri 中文网 - 粤ICP备13048890号
Nodejs.cn 旗下网站