Tauri Setup

You are a Rust and desktop application expert. The user wants to scaffold a new Tauri desktop application with a Rust backend, including frontend framework integration and proper project structure.

What to check first

• Run rustc --version to verify Rust is installed (1.56+)
• Run node --version and npm --version to confirm Node.js/npm are available
• Confirm cargo is in PATH with cargo --version

Steps

1. Install Tauri CLI globally with npm install -g @tauri-apps/cli@latest
2. Create new project directory with cargo create-tauri-app and select React, Vue, or vanilla JS as frontend
3. Navigate to project root and verify src-tauri/Cargo.toml exists with tauri crate dependency (check version >= 1.0)
4. Install Rust dependencies in src-tauri with cargo fetch to cache crates locally
5. Set up frontend dependencies by running npm install in the project root
6. Configure tauri.conf.json in src-tauri with correct productName, identifier (reverse domain format), and version
7. Build the Tauri backend with cargo build --release from src-tauri directory
8. Launch dev environment with npm run tauri dev to start hot-reload server and Tauri window
9. Verify window opens by checking console output for "Tauri started successfully"

Code

// src-tauri/src/main.rs - Minimal Tauri app setup
#![cfg_attr(
    all(not(debug_assertions), target_os = "windows"),
    windows_subsystem = "windows"
)]

use tauri::{Manager, Window};

fn main() {
    tauri::Builder::default()
        .setup(|app| {
            let window = app.get_window("main").unwrap();
            
            // Optional: Programmatic window setup
            window.set_title("My Tauri App").unwrap();
            window.show().ok();
            
            Ok(())
        })
        .invoke_handler(tauri::generate_handler![
            greet,
            fetch_user_data,
        ])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

#[tauri::command]
fn greet(name: &str) -> String {
    format!("Hello, {}!", name)
}

#[tauri::command]
async fn fetch_user_data(user_id: String) -> Result<String, String> {
    // Simulated async backend call
    Ok(format!("User data for: {}", user_id))
}

// src/App.tsx - React frontend example
import { invoke } from '@tauri-apps/api/tauri';

export default function App() {
    const [greeting, setGreeting] = useState('

Note: this example was truncated in the source. See the GitHub repo for the latest full version.

Common Pitfalls

• Treating this skill as a one-shot solution — most workflows need iteration and verification
• Skipping the verification steps — you don't know it worked until you measure
• Applying this skill without understanding the underlying problem — read the related docs first

When NOT to Use This Skill

• When a simpler manual approach would take less than 10 minutes
• On critical production systems without testing in staging first
• When you don't have permission or authorization to make these changes

How to Verify It Worked

• Run the verification steps documented above
• Compare the output against your expected baseline
• Check logs for any warnings or errors — silent failures are the worst kind

Production Considerations

• Test in staging before deploying to production
• Have a rollback plan — every change should be reversible
• Monitor the affected systems for at least 24 hours after the change