ash
# Install Tauri CLI
cargo install tauri-cli

# Or use npm
npm install -g @tauri-apps/cli

# Create new project
npm create tauri-app@latest

# Or add to existing project
cd your-web-app
npm install -D @tauri-apps/cli
npm run tauri init

ash
npm create tauri-app@latest my-app
cd my-app
npm install
npm run tauri dev

my-app/
鈹溾攢鈹€ src-tauri/           # Tauri backend
鈹?  鈹溾攢鈹€ src/            # Rust code
鈹?  鈹溾攢鈹€ tauri.conf.json # Configuration
鈹?  鈹斺攢鈹€ icons/          # App icons
鈹溾攢鈹€ src/                # Frontend code
鈹溾攢鈹€ index.html
鈹斺攢鈹€ package.json

ypescript
import { invoke } from '@tauri-apps/api/tauri'

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

  async function greet() {
    // Call Rust function from JavaScript
    const result = await invoke('greet', { name: 'World' })
    setGreeting(result)
  }

  return (
    <div>
      <button onClick={greet}>Greet</button>
      <p>{greeting}</p>
    </div>
  )
}

ue
<template>
  <button @click="greet">Greet</button>
  <p>{{ message }}</p>
</template>

<script setup>
import { ref } from 'vue'
import { invoke } from '@tauri-apps/api/tauri'

const message = ref('')

async function greet() {
  message.value = await invoke('greet', { name: 'World' })
}
</script>

ust
// src-tauri/src/lib.rs
#[tauri::command]
fn greet(name: &str) -> String {
    format!("Hello, {}! You've been greeted from Rust!", name)
}

fn main() {
    tauri::Builder::default()
        .invoke_handler(tauri::generate_handler![greet])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

ypescript
import { open, save } from '@tauri-apps/api/dialog'
import { readTextFile, writeTextFile } from '@tauri-apps/api/fs'

// Open file dialog
const selected = await open({
  multiple: false,
  filters: [{
    name: 'Text',
    extensions: ['txt', 'md']
  }]
})

// Read file
const content = await readTextFile(selected)

// Write file
await writeTextFile('output.txt', 'Hello Tauri!')

ypescript
import { appWindow } from '@tauri-apps/api/window'

// Minimize window
await appWindow.minimize()

// Maximize window
await appWindow.maximize()

// Close window
await appWindow.close()

// Toggle fullscreen
await appWindow.setFullscreen(true)

ypescript
import { sendNotification } from '@tauri-apps/api/notification'

await sendNotification({
  title: 'Hello',
  body: 'Notification from Tauri'
})

ypescript
import { open } from '@tauri-apps/api/dialog'
import { readDir } from '@tauri-apps/api/fs'

async function selectFolder() {
  const dir = await open({ directory: true })
  const entries = await readDir(dir)
  return entries
}

ypescript
import { TrayIcon, MenuItem } from '@tauri-apps/api/tray'

await TrayIcon.new({
  icon: 'icon.png',
  menu: [
    {
      id: 'quit',
      label: 'Quit'
    }
  ]
})

ash
npm run tauri dev

ash
npm run tauri build

json
{
  "build": {
    "beforeDevCommand": "npm run dev",
    "beforeBuildCommand": "npm run build",
    "devPath": "http://localhost:3000",
    "distDir": "../dist"
  },
  "package": {
    "productName": "My App",
    "version": "1.0.0"
  },
  "tauri": {
    "allowlist": {
      "all": true
    }
  }
}