Skip to content
Tauri
指南 參考 部落格 發行版本

開發

Now that you have everything set up, you are ready to run your application using Tauri.

If you are using an UI framework or JavaScript bundler you likely have access to a development server that will speed up your development process, so if you haven’t configured your app’s dev URL and script that starts it, you can do so via the devUrl and beforeDevCommand config values

tauri.conf.json
{
  "build": {
    "devUrl": "http://localhost:3000",
    "beforeDevCommand": "npm run dev"
  }
}

Otherwise if you are not using a UI framework or module bundler you can point Tauri to your frontend source code and the Tauri CLI will start a development server for you

tauri.conf.json
{
  "build": {
    "frontendDist": "./src"
  }
}

Note that in this example the src folder must include a index.html file along any other assets loaded by your frontend.

Developing Your Desktop Application

To develop your application for desktop, run the tauri dev command.

npm run tauri dev

The first time you run this command, the Rust package manager may need several minutes to download and build all the required packages. Since they are cached, subsequent builds are much faster, as only your code needs rebuilding.

Once Rust has finished building, the webview opens, displaying your web app. You can make changes to your web app, and if your tooling supports it, the webview should update automatically, just like a browser.

Opening the Web Inspector

You can open the Web Inspector to debug your application by performing a right-click on the webview and clicking “Inspect” or using the Ctrl + Shift + I shortcut on Windows and Linux or Cmd + Option + I shortcut on macOS.

Developing your Mobile Application

Developing for mobile is similar to how desktop development works, but you must run tauri android dev or tauri ios dev instead

npm run tauri [android|ios] dev

The first time you run this command, the Rust package manager may need several minutes to download and build all the required packages. Since they are cached, subsequent builds are much faster, as only your code needs rebuilding.

Development Server

The development server on mobile works similarly to the desktop one, but if you are trying to run on a physical iOS device, you must configure it to listen to a particular address provided by the Tauri CLI, defined in the TAURI_DEV_HOST environment variable. This address is either a public network address (which is the default behavior) or the actual iOS device TUN address - which is more secure, but currently needs Xcode to connect to the device.

To use the iOS device’s address you must open Xcode before running the dev command and ensure your device is connected via network in the Window > Devices and Simulators menu. Then you must run tauri ios dev --force-ip-prompt to select the iOS device address (a IPv6 address ending with ::2).

To make your development server listen on the correct host to be accessible by the iOS device you must tweak its configuration to use the TAURI_DEV_HOST value if it has been provided. Here is an example configuration for Vite

import { defineConfig } from 'vite';


const host = process.env.TAURI_DEV_HOST;


// https://vite.dev.org.tw/config/
export default defineConfig({
  clearScreen: false,
  server: {
    host: host || false,
    port: 1420,
    strictPort: true,
    hmr: host
      ? {
          protocol: 'ws',
          host,
          port: 1421,
        }
      : undefined,
  },
});

Check your framework’s setup guide for more information.

Device Selection

By default the mobile dev command tries to run your application in a connected device, and fallbacks to prompting you to select a simulator to use. To define the run target upfront you can provide the device or simulator name as argument

npm run tauri ios dev 'iPhone 15'

Using Xcode or Android Studio

Alternatively you can choose to use Xcode or Android Studio to develop your application. This can help you troubleshoot some development issues by using the IDE instead of the command line tools. To open the mobile IDE instead of running on a connected device or simulator, use the --open flag

npm run tauri [android|ios] dev --open

Opening the Web Inspector

  • iOS

    Safari must be used to access the Web Inspector for your iOS application.

    Open the Safari on your Mac machine, choose Safari > Settings in the menu bar, click Advanced, then select Show features for web developers.

    If you are running on a physical device you must enable Web Inspector in Settings > Safari > Advanced.

    After following all steps you should see a Develop menu in Safari, where you will find the connected devices and applications to inspect. Select on your device or simulator and click on localhost to open the Safari Developer Tools window.

  • Android

    The inspector is enabled by default for Android emulators, but you must enable it for physical devices. Connect your Android device to the computer, open the Settings app in the Android device, select About, scroll to Build Number and tap that 7 times. This will enable Developer Mode for your Android device and the Developer Options settings.

    To enable application debugging on your device you must enter the Developer Options settings, toggle on the developer options switch and enable USB Debugging.

    The Web Inspector for Android is powered by Google Chrome’s DevTools and can be accessed by navigating to chrome://inspect in the Chrome browser. Your device or emulator should appear in the remote devices list if your Android application is running, and you can open the developer tools by clicking inspect on your device.

疑難排解

  1. 在 Xcode 上執行建置腳本時發生錯誤

Tauri 透過建立一個建置階段來掛鉤到 iOS Xcode 專案中，該階段執行 Tauri CLI 以編譯 Rust 原始碼作為在執行階段載入的函式庫。建置階段在 Xcode 處理程序上下文中執行，因此它可能無法使用 Shell 修改，例如 PATH 新增，因此當使用 Node.js 版本管理器等工具時請小心，這些工具可能不相容。

  1. 首次執行 iOS 應用程式時出現網路權限提示

在您第一次執行 tauri ios dev 時，您可能會看到 iOS 提示您授權以尋找並連線到您本機網路上的裝置。 存取 iOS 裝置的開發伺服器需要此權限，因為我們必須在本機網路中公開它。 若要在您的裝置中執行您的應用程式，您必須按一下「允許」並重新啟動您的應用程式。

Reacting to Source Code Changes

與您的 webview 即時反映變更的方式類似，Tauri 會監看您的 Rust 檔案是否有變更，因此當您修改任何檔案時，您的應用程式會自動重建並重新啟動。

您可以使用 tauri dev 命令上的 --no-watch 標記來停用此行為。

若要限制監看變更的檔案，您可以在 src-tauri 資料夾中建立 .taurignore 檔案。 此檔案的工作方式與一般 Git ignore 檔案相同，因此您可以忽略任何資料夾或檔案

build/
src/generated/*.rs
deny.toml

Using the Browser DevTools

Tauri 的 API 僅在您的應用程式視窗中運作，因此一旦您開始使用它們，您將無法再在系統的瀏覽器中開啟您的前端。

如果您偏好使用瀏覽器的開發人員工具，您必須設定 tauri-invoke-http 以透過 HTTP 伺服器橋接 Tauri API 呼叫。

Source Control

在您的專案儲存庫中，您應該將 src-tauri/Cargo.lock 與 src-tauri/Cargo.toml 一起提交到 git，因為 Cargo 使用鎖定檔來提供確定性建置。 因此，建議所有應用程式都簽入其 Cargo.lock。 您不應該提交 src-tauri/target 資料夾或其任何內容。

© 2025 Tauri Contributors. CC-BY / MIT