vite-plugin-tauri

A Vite plugin to seamlessly integrate with Tauri.

Features

• 🔄 Auto Integration Automatically initializes and integrates Tauri with your Vite project
• 🛠️ Dev Mode Launches Tauri alongside your Vite dev server
• 📦 Build Ready Configures Tauri build with your Vite output directory
• 🧰 CLI Passthrough Supports passing Tauri CLI arguments for advanced configurations
• 🌐 Multi-Environment Works across different platforms with proper configuration
• 💼 Zero Config Works out of the box with sensible defaults
• 🧠 Smart Detection Automatically detects your Tauri configuration file
• 🔍 System Tray Easily add system tray functionality to your desktop applications

Install

npm install -D @stacksjs/vite-plugin-tauri
# or
yarn add -D @stacksjs/vite-plugin-tauri
# or
pnpm add -D @stacksjs/vite-plugin-tauri
# or
bun add -D @stacksjs/vite-plugin-tauri

Get Started

// vite.config.ts
import { defineConfig } from 'vite'
import Tauri from 'vite-plugin-tauri'

export default defineConfig({
  plugins: [
    Tauri()
  ]
})

That's it! When you run your Vite development server, Tauri will automatically be initialized if not already present, and will launch alongside your Vite app.

Configuration

The plugin accepts an optional configuration object. Here's an example with available options:

// vite.config.ts
import { defineConfig } from 'vite'
import Tauri from 'vite-plugin-tauri'

export default defineConfig({
  plugins: [
    Tauri({
      // System tray configuration
      systemTray: {
        enabled: true, // Enable system tray support
        menuOnLeftClick: true, // Show menu on left click (default: true)
        useAppIcon: true // Use the app icon as the tray icon (default: true)
      }
    })
  ]
})

CLI Arguments

You can pass arguments to the Tauri CLI by adding them after a double dash (--) and the -t or --tauri flag:

# Development mode
npm run dev -- -t --debug

# Build mode
npm run build -- -t --debug

Environment Variables

• TAURI_PATH_DEPTH: Controls how deep the plugin searches for Tauri configuration files. Default is 3.

Usage with Tauri

This plugin works with Tauri, a framework for building desktop applications with web technologies.

Initializing a Tauri Project

If you don't have a Tauri project initialized in your directory, the plugin will automatically prompt you to create one when you run your Vite dev server:

npm run dev

Tauri Configuration

The plugin will automatically find your Tauri configuration file (tauri.conf.json, tauri.conf.json5, or Tauri.toml) and use it to configure the integration.

Tauri CLI

For advanced Tauri configuration, you can use the Tauri CLI directly. The plugin is designed to work alongside the CLI without conflicts.

For more information on Tauri, visit tauri.app.

Testing

bun test

Changelog

Please see our releases page for more information on what has changed recently.

Contributing

Please review the Contributing Guide for details.

Community

For help, discussion about best practices, or any other conversation that would benefit from being searchable:

Discussions on GitHub

For casual chit-chat with others using this package:

Join the Stacks Discord Server

Postcardware

“Software that is free, but hopes for a postcard.” We love receiving postcards from around the world showing where vite-plugin-tauri is being used! We showcase them on our website too.

Our address: Stacks.js, 12665 Village Ln #2306, Playa Vista, CA 90094, United States 🌎

Sponsors

We would like to extend our thanks to the following sponsors for funding Stacks development. If you are interested in becoming a sponsor, please reach out to us.

• JetBrains
• The Solana Foundation

Credits

• Tauri for creating a powerful desktop app framework
• Chris Breuer
• All Contributors

License

The MIT License (MIT). Please see LICENSE for more information.

Made with 💙