build

179 notes in this subject, read out of this brain and free to use. This is page 2 of 3.

Recommended Tauri starter configuration

For beginners, the documentation recommends starting with: TypeScript/JavaScript as the frontend language, pnpm as the package manager, Vanilla as the UI template, and TypeScript as the UI flavor. A frontend framework can be integrated later.

Starting development server after create-tauri-app

After create-tauri-app completes, navigate into the project folder, install dependencies with your package manager (npm install, yarn install, pnpm install, deno install, or bun install), then start the development server with the appropriate command: npm run tauri dev, yarn tauri dev, pnpm tauri dev, deno task tauri dev, bun tauri dev, or cargo tauri dev.

Manual Tauri setup for existing projects

To add Tauri to an existing frontend project: (1) Install the Tauri CLI as a dev dependency using npm install -D @tauri-apps/cli@latest (or equivalent for your package manager), or globally with cargo install tauri-cli --version "^2.0.0" --locked. (2) Determine your frontend development server URL (e.g., http://localhost:5173 for Vite). (3) Run tauri init and provide configuration prompts: app name, window title, web assets location, dev server URL, frontend dev command, and frontend build command. (4) Configure vite.config.ts to ignore the src-tauri directory in watch: server.watch.ignored: ["**/src-tauri/**"]. (5) Run tauri dev to compile Rust code and open the app.

Vite configuration to prevent watching src-tauri directory

In vite.config.ts, configure the server.watch.ignored option to prevent Vite from watching the src-tauri directory. Example configuration: import { defineConfig } from "vite"; export default defineConfig({ server: { watch: { ignored: ["**/src-tauri/**"] } } });

Next.js static exports requirement

Next.js must be configured with output: 'export' to work with Tauri. Tauri does not support server-based solutions, so static site generation is required.

Next.js Image component in SSG mode

When using Next.js in static export mode with Tauri, set images.unoptimized to true in next.config.mjs to use the Next.js Image component without the image optimization API.

Nuxt build command for Tauri

Use `nuxi build` to compile a Nuxt project for Tauri.

Create new Qwik app command

To create a new Qwik application, run: npm create qwik@latest (npm), yarn create qwik@latest (yarn), pnpm create qwik@latest (pnpm), or deno run -A npm:create-qwik@latest (deno).

Install Tauri CLI for Qwik project

To add the Tauri CLI to a Qwik project, run: npm install -D @tauri-apps/cli@latest (npm), yarn add -D @tauri-apps/cli@latest (yarn), pnpm add -D @tauri-apps/cli@latest (pnpm), or deno add -D npm:@tauri-apps/cli@latest (deno).

Initialize Tauri project in Qwik

After installing the Tauri CLI, initialize a new Tauri project by running: npm run tauri init (npm), yarn tauri init (yarn), pnpm tauri init (pnpm), or deno task tauri init (deno).

Qwik static adapter installation

After creating a new Qwik app, install the static adapter by running: npm run qwik add static (npm), yarn qwik add static (yarn), pnpm qwik add static (pnpm), or deno task qwik add static (deno).

Start Qwik Tauri app in development

To start your Tauri app with Qwik in development mode, run: npm run tauri dev (npm), yarn tauri dev (yarn), pnpm tauri dev (pnpm), or deno task tauri dev (deno).

Enable withGlobalTauri for Tauri API access

Enable the 'withGlobalTauri' configuration option to ensure that Tauri APIs are available in the window.__TAURI__ variable and can be imported using wasm-bindgen.

Trunk bundler for Tauri

Trunk is a WASM web application bundler for Rust used with Tauri. This guide is accurate as of Trunk 0.17.5. Learn more at https://trunk-rs.github.io/trunk/

Trunk static site generation requirement

Use SSG (static site generation) with Trunk in Tauri projects. Server-based solutions are not officially supported by Tauri.

Trunk websocket protocol for mobile development

Set serve.ws_protocol to 'ws' in Trunk configuration so that the hot-reload websocket can connect properly for mobile development.

SvelteKit default dev server port

SvelteKit's default development server runs on http://localhost:5173.

SvelteKit adapter requirement for Tauri

Use the static-adapter via @sveltejs/adapter-static for both SSG (Static Site Generation) and SPA (Single-Page Application) modes. Tauri does not support server-based solutions.

SvelteKit SSG prerendering and Tauri API access

When using SSG with prerendering, load functions will not have access to Tauri APIs during the build process. Using SPA mode without prerendering is recommended since load functions will only run in the webview where Tauri APIs are available.

Install @sveltejs/adapter-static

Install the static adapter using npm install --save-dev @sveltejs/adapter-static (or equivalent in yarn, pnpm, or deno).

SvelteKit svelte.config.js setup for Tauri

Import adapter from '@sveltejs/adapter-static' and vitePreprocess from '@sveltejs/vite-plugin-svelte'. Configure the kit.adapter with fallback set to 'index.html'.

SvelteKit SSR configuration for Tauri

Create a root +layout.ts (or +layout.js) file in src/routes/ with the content 'export const ssr = false;' to disable SSR for the entire app.

Why disable SSR in SvelteKit for Tauri

Disabling SSR in SvelteKit allows the use of APIs that depend on the global window object (like Tauri's API) without requiring client-side checks. While static-adapter does not require SSR to be disabled, doing so enables direct access to window-dependent APIs.

Tauri minimal app size

Tauri apps leverage the webview already available on every user's system and only contain the code and assets specific to that app. This means a minimal Tauri app can be less than 600KB in size.

Complete Vite configuration example for Tauri

import { defineConfig } from 'vite'; const host = process.env.TAURI_DEV_HOST; export default defineConfig({ clearScreen: false, server: { port: 5173, strictPort: true, host: host || false, hmr: host ? { protocol: 'ws', host, port: 1421, } : undefined, watch: { ignored: ['**/src-tauri/**'], }, }, envPrefix: ['VITE_', 'TAURI_ENV_*'], build: { target: process.env.TAURI_ENV_PLATFORM == 'windows' ? 'chrome105' : 'safari13', minify: !process.env.TAURI_ENV_DEBUG ? 'esbuild' : false, sourcemap: !!process.env.TAURI_ENV_DEBUG, }, });

TAURI_DEV_HOST for iOS physical devices

Use process.env.TAURI_DEV_HOST as the development server host IP when set to run on iOS physical devices. This should be configured in vite.config.js to override the default host binding.

Vite configuration for Tauri development

Configure vite.config.js with the following settings: clearScreen: false to prevent Vite from obscuring Rust errors; server.port: 5173 (must match devUrl port in tauri.conf.json); server.strictPort: true to fail if the port is unavailable; server.host: use process.env.TAURI_DEV_HOST if set, otherwise false; server.hmr with protocol 'ws', host from TAURI_DEV_HOST, and port 1421 when host is set; server.watch.ignored: ['**/src-tauri/**'] to prevent watching the Rust source directory.

Vite environment variable prefix for Tauri

Set envPrefix to ['VITE_', 'TAURI_ENV_*'] in vite.config.js. This exposes environment variables starting with VITE_ or TAURI_ENV_ through import.meta.env in Tauri's source code.

Vite build target for Tauri

Set the build target based on platform: 'chrome105' for Windows (Tauri uses Chromium), 'safari13' for macOS and Linux (Tauri uses WebKit). Determine the platform with process.env.TAURI_ENV_PLATFORM.

Vite minification and sourcemap configuration for Tauri

Set minify to 'esbuild' for production builds and false for debug builds (check process.env.TAURI_ENV_DEBUG). Enable sourcemap with !!process.env.TAURI_ENV_DEBUG for debug builds only.

Vite configuration migration for Tauri 2.0 dev server

Updated Vite configuration for Tauri 2.0 should read the TAURI_DEV_HOST environment variable and set the server host to `host || false` and hmr to `{ protocol: 'ws', host: host, port: 1430 }` when host is truthy. The internal-ip npm package is no longer required. Example: ```js import { defineConfig } from 'vite'; import { svelte } from '@sveltejs/vite-plugin-svelte'; const host = process.env.TAURI_DEV_HOST; export default defineConfig({ plugins: [svelte()], clearScreen: false, server: { host: host || false, port: 1420, strictPort: true, hmr: host ? { protocol: 'ws', host: host, port: 1430, } : undefined, }, }); ```

Development server network exposure change in Tauri 2.0

The built-in mobile development server in Tauri 2.0 no longer exposes network-wide. Instead, it tunnels traffic directly from the local machine to the device. This change applies automatically on Android and most iOS scenarios, but on iOS devices running directly or from Xcode, the public network address is used by default. To work around this on iOS, open Xcode to establish a connection, then run `tauri ios dev --force-ip-prompt` to select the iOS device's TUN address (ending with ::2).

Upgrade paths for Tauri

Tauri users can upgrade from version 1.0 to version 2, or migrate from the Tauri 2.0 beta to the stable 2.0 release. Each upgrade path has specific documentation and required updates to migrate projects.

Windows system dependencies for Tauri

Tauri on Windows requires Microsoft C++ Build Tools and Microsoft Edge WebView2. Download the Microsoft C++ Build Tools installer and check the 'Desktop development with C++' option during installation. WebView2 is already installed on Windows 10 (version 1803 onward) and later, but if needed, install the 'Evergreen Bootstrapper' from the WebView2 Runtime download section.

VBSCRIPT requirement for Windows MSI package building

Building MSI installer packages on Windows requires the VBSCRIPT optional feature to be enabled. This is only needed if building MSI packages (targets set to 'msi' or 'all' in tauri.conf.json). If you encounter errors like 'failed to run light.exe' when building, enable VBSCRIPT by opening Settings → Apps → Optional features → More Windows features, locating VBSCRIPT, ensuring it is checked, clicking Next, and restarting if prompted. Note that VBSCRIPT is currently enabled by default on most Windows installations but is being deprecated.

Install Rust for Tauri development

Tauri is built with Rust and requires it for development. On Linux and macOS, install via rustup using: curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh. On Windows, visit https://www.rust-lang.org/tools/install to install rustup, or use PowerShell: winget install --id Rustlang.Rustup. Be sure to restart your Terminal and in some cases your system for changes to take effect.

MSVC toolchain requirement for Windows Rust

For full support for Tauri and tools like trunk, ensure the MSVC Rust toolchain is the selected default host triple in the rustup installer. Depending on your system it should be either x86_64-pc-windows-msvc, i686-pc-windows-msvc, or aarch64-pc-windows-msvc. If Rust is already installed, run: rustup default stable-msvc

Node.js installation for JavaScript frontend frameworks

Node.js is only required if you intend to use a JavaScript frontend framework. Download the Long Term Support (LTS) version from https://nodejs.org and install it. Verify installation with 'node -v' and 'npm -v'. Restart your Terminal to ensure it recognizes the installation, and in some cases you may need to restart your computer. While npm is the default package manager, you can also use pnpm or yarn by running 'corepack enable' in your Terminal.

Linux system dependencies for Tauri development

Tauri requires system dependencies on Linux that vary by distribution. For Debian: libwebkit2gtk-4.1-dev, build-essential, curl, wget, file, libxdo-dev, libssl-dev, libayatana-appindicator3-dev, librsvg2-dev. For Arch: webkit2gtk-4.1, base-devel, curl, wget, file, openssl, appmenu-gtk-module, libappindicator-gtk3, librsvg, xdotool. For Fedora: webkit2gtk4.1-devel, openssl-devel, curl, wget, file, libappindicator-gtk3-devel, librsvg2-devel, libxdo-devel, plus 'c-development' group. For Gentoo: net-libs/webkit-gtk:4.1, dev-libs/libayatana-appindicator, net-misc/curl, net-misc/wget, sys-apps/file. For OSTree: webkit2gtk4.1-devel, openssl-devel, curl, wget, file, libappindicator-gtk3-devel, librsvg2-devel, libxdo-devel, gcc, gcc-c++, make. For openSUSE: webkit2gtk3-devel, libopenssl-devel, curl, wget, file, libappindicator3-1, librsvg-devel, plus 'devel_basis' pattern. For Alpine: build-base, webkit2gtk-4.1-dev, curl, wget, file, openssl, libayatana-appindicator-dev, librsvg.

iOS development setup for Tauri

iOS development requires Xcode and is only available on macOS. Add iOS targets with rustup: rustup target add aarch64-apple-ios x86_64-apple-ios aarch64-apple-ios-sim. Install Homebrew using: /bin/bash -c '$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)'. Install Cocoapods using Homebrew: brew install cocoapods

PowerShell environment variable refresh for Android setup

After setting environment variables for Android development on Windows in PowerShell, apps may not refresh them automatically. To let them pick up the changes in your current PowerShell session, run: [System.Environment]::GetEnvironmentVariables('User').GetEnumerator() | % { Set-Item -Path "Env:\$($_.key)" -Value $_.value }

Android development setup for Tauri

To target Android, download and install Android Studio. Set JAVA_HOME environment variable to /opt/android-studio/jbr (Linux), '/Applications/Android Studio.app/Contents/jbr/Contents/Home' (macOS), or 'C:\Program Files\Android\Android Studio\jbr' (Windows). Use SDK Manager to install: Android SDK Platform, Android SDK Platform-Tools, NDK (Side by side), Android SDK Build-Tools, Android SDK Command-line Tools. Set ANDROID_HOME to $HOME/Android/Sdk (Linux), $HOME/Library/Android/sdk (macOS), or $env:LocalAppData\Android\Sdk (Windows). Set NDK_HOME to $ANDROID_HOME/ndk/$(ls -1 $ANDROID_HOME/ndk) (Linux/macOS) or $env:LocalAppData\Android\Sdk\ndk\$VERSION (Windows). Add Android targets with rustup: rustup target add aarch64-linux-android armv7-linux-androideabi i686-linux-android x86_64-linux-android

Alpine Linux fonts requirement for Tauri

Alpine Linux containers do not include any fonts by default. To ensure text renders correctly in your Tauri app on Alpine, install at least one font package, for example font-dejavu.

macOS system dependencies for Tauri

Tauri uses Xcode and various macOS and iOS development dependencies on macOS. Download and install Xcode from the Mac App Store or Apple Developer website, and launch Xcode after installing so it can finish setting up. For desktop-only development, you can install Xcode Command Line Tools instead using 'xcode-select --install'.

Tauri build process for JavaScript and Rust

Tauri works like a static web host. The build process compiles the JavaScript project to static files first, then compiles the Rust project that bundles those static files. The JavaScript project setup is the same as building a static website.

build.rs file content

The build.rs file contains `tauri_build::build()`, which is used for Tauri's build system.

Tauri 2.0 Menu example with event handling

Example showing menu creation with event handling in Rust: ```rust use tauri::menu::{CheckMenuItemBuilder, MenuBuilder, MenuItemBuilder}; tauri::Builder::default() .setup(|app| { let toggle = MenuItemBuilder::with_id("toggle", "Toggle").build(app)?; let check = CheckMenuItemBuilder::new("Mark").build(app)?; let menu = MenuBuilder::new(app).items(&[&toggle, &check]).build()?; app.set_menu(menu)?; app.on_menu_event(move |app, event| { if event.id() == check.id() { println!("`check` triggered, is checked? {}", check.is_checked().unwrap()); } else if event.id() == "toggle" { println!("toggle triggered!"); } }); Ok(()) }) ```

Tauri 2.0 Tray Icon example with menu and event handling

Example showing tray icon creation with menu and event handling in Rust: ```rust use tauri::{ menu::{MenuBuilder, MenuItemBuilder}, tray::{MouseButton, MouseButtonState, TrayIconBuilder, TrayIconEvent}, }; tauri::Builder::default() .setup(|app| { let toggle = MenuItemBuilder::with_id("toggle", "Toggle").build(app)?; let menu = MenuBuilder::new(app).items(&[&toggle]).build()?; let tray = TrayIconBuilder::new() .menu(&menu) .on_menu_event(move |app, event| match event.id().as_ref() { "toggle" => println!("toggle clicked"), _ => (), }) .on_tray_icon_event(|tray, event| { if let TrayIconEvent::Click { button: MouseButton::Left, button_state: MouseButtonState::Up, .. } = event { let app = tray.app_handle(); if let Some(webview_window) = app.get_webview_window("main") { let _ = webview_window.unminimize(); let _ = webview_window.show(); let _ = webview_window.set_focus(); } } }) .build(app)?; Ok(()) }) ```

Tauri 2.0: Migrate to Tray Icon Module

The Rust `SystemTray` APIs were renamed to `TrayIcon` for consistency. Use `tauri::tray::TrayIconBuilder` instead of `tauri::SystemTray`. Use `tauri::menu::Menu` instead of `tauri::SystemTrayMenu`, `tauri::menu::Submenu` instead of `tauri::SystemTraySubmenu`, and `tauri::menu::PredefinedMenuItem` instead of `tauri::SystemTrayMenuItem`. `tauri::SystemTray::on_event` split into `tauri::tray::TrayIconBuilder::on_menu_event` and `tauri::tray::TrayIconBuilder::on_tray_icon_event`.

Tauri 2.0 mobile support setup

To support mobile in Tauri 2.0, your project must output a shared library. Modify `src-tauri/Cargo.toml` to add a `[lib]` section with `name = "app_lib"` and `crate-type = ["staticlib", "cdylib", "rlib"]`. Rename `src-tauri/src/main.rs` to `src-tauri/src/lib.rs`. Change the main function to a pub fn named `run()` with `#[cfg_attr(mobile, tauri::mobile_entry_point)]` attribute. Create a new `src-tauri/src/main.rs` that calls `app_lib::run()`.

Tauri 2.0: Migrate to CLI Plugin

The Rust `App::get_cli_matches` and JavaScript `@tauri-apps/api/cli` APIs were removed. Add `tauri-plugin-cli = "2"` to Cargo.toml dependencies. In Rust, add `.plugin(tauri_plugin_cli::init())` to the builder and use `app.cli().matches()?` in setup. In JavaScript, add `@tauri-apps/plugin-cli` to package.json and use `import { getMatches } from '@tauri-apps/plugin-cli'; const matches = await getMatches();`.

Tauri 2.0: Migrate to Clipboard Plugin

The Rust `App::clipboard_manager` and `AppHandle::clipboard_manager` and JavaScript `@tauri-apps/api/clipboard` APIs were removed. Add `tauri-plugin-clipboard-manager = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_clipboard_manager::init())` and use `app.clipboard().write(ClipKind::PlainText { label: None, text: "..." })`. In JavaScript, add `@tauri-apps/plugin-clipboard-manager` to package.json and use `import { writeText, readText } from '@tauri-apps/plugin-clipboard-manager'; await writeText('text'); const text = await readText();`.

Tauri 2.0: Migrate to Dialog Plugin

The Rust `tauri::api::dialog` and JavaScript `@tauri-apps/api/dialog` APIs were removed. Add `tauri-plugin-dialog = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_dialog::init())` and use `app.dialog().file().pick_file(callback)` or `app.dialog().message(...).show()`. In JavaScript, add `@tauri-apps/plugin-dialog` to package.json and use `import { save } from '@tauri-apps/plugin-dialog'; const filePath = await save({ filters: [...] });`.

Tauri 2.0: Migrate to File System Plugin

The Rust `tauri::api::file` and JavaScript `@tauri-apps/api/fs` APIs were removed. For Rust, use `std::fs`. For JavaScript, add `tauri-plugin-fs = "2"` to Cargo.toml and `@tauri-apps/plugin-fs` to package.json. Several functions renamed: `createDir` to `mkdir`, `readBinaryFile` to `readFile`, `writeBinaryFile` to `writeFile`, `removeDir` and `removeFile` replaced with `remove`, `renameFile` replaced with `rename`. `Dir` enum alias removed, use `BaseDirectory` instead.

Tauri 2.0: Migrate to Global Shortcut Plugin

The Rust `App::global_shortcut_manager` and JavaScript `@tauri-apps/api/global-shortcut` APIs were removed. Add `tauri-plugin-global-shortcut = "2"` to Cargo.toml (with `target_os` guards for non-mobile). In Rust, use `.plugin(tauri_plugin_global_shortcut::Builder::default().build()).setup()` and `app.global_shortcut().register("CmdOrCtrl+Y")?`. In JavaScript, add `@tauri-apps/plugin-global-shortcut` to package.json and use `import { register } from '@tauri-apps/plugin-global-shortcut'; await register('CommandOrControl+Shift+C', () => {...});`.

Tauri 2.0: Migrate to HTTP Plugin

The Rust `tauri::api::http` and JavaScript `@tauri-apps/api/http` APIs were removed. Add `tauri-plugin-http = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_http::init())` and use the re-exported `tauri_plugin_http::reqwest`. In JavaScript, add `@tauri-apps/plugin-http` to package.json and use `import { fetch } from '@tauri-apps/plugin-http'; const response = await fetch('https://...');`.

Tauri 2.0: Migrate to Notification Plugin

The Rust `tauri::api::notification` and JavaScript `@tauri-apps/api/notification` APIs were removed. Add `tauri-plugin-notification = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_notification::init())` and use `app.notification().request_permission()?` and `app.notification().builder().body(...).show()?`. In JavaScript, add `@tauri-apps/plugin-notification` to package.json and use `import { sendNotification } from '@tauri-apps/plugin-notification'; sendNotification('message');`.

Tauri 2.0: Migrate to OS Plugin

The Rust `tauri::api::os` and JavaScript `@tauri-apps/api/os` APIs were removed. Add `tauri-plugin-os = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_os::init())` and use `tauri_plugin_os::arch()`. In JavaScript, add `@tauri-apps/plugin-os` to package.json and use `import { arch } from '@tauri-apps/plugin-os'; const architecture = await arch();`.

Tauri 2.0: Migrate to Process Plugin

The Rust `tauri::api::process` and JavaScript `@tauri-apps/api/process` APIs were removed. Add `tauri-plugin-process = "2"` to Cargo.toml. In Rust, add `.plugin(tauri_plugin_process::init())` and use `app.handle().exit(1)` or `app.handle().restart()`. In JavaScript, add `@tauri-apps/plugin-process` to package.json and use `import { exit, relaunch } from '@tauri-apps/plugin-process'; await exit(0); await relaunch();`.

Tauri 2.0: Migrate to Shell Plugin

The Rust `tauri::api::shell` and JavaScript `@tauri-apps/api/shell` APIs were removed. Add `tauri-plugin-shell = "2"` to Cargo.toml. In JavaScript, add `@tauri-apps/plugin-shell` to package.json and use `import { Command, open } from '@tauri-apps/plugin-shell';`. In Rust, add `.plugin(tauri_plugin_shell::init())` and use `app.shell().open("url", None)` or `app.shell().command("cmd").args([...]).status().await`.

Give your agent this brain