Tauri Vue3 Template

April 4, 2026 ยท View on GitHub

logo

Tauri Vue3 Template

A modern desktop application template built with Tauri v2 and Vue 3.

Features

  • ๐ŸŽจ Beautiful UI with Vuetify 3 Material Design
  • ๐ŸŒ Multi-language support (i18n)
  • ๐ŸŒ“ Dark/Light theme
  • ๐Ÿ“ฆ State management with Pinia
  • ๐Ÿ—‚๏ธ File system operations with Tauri plugins
  • ๐Ÿ”” System notifications
  • ๐Ÿš€ Fast and lightweight Rust backend
  • ๐Ÿ“ฑ Cross-platform (Windows, macOS, Linux)

Use cases

  • vrm2sl - VRM (glTF) mesh model to Second Life avatar converter.
  • Drop Compress Image - Next generation image converter. (avif, webp, jpeg-xl, webp, jpeg-li, zopfli png)

Tech Stack

Frontend

  • Vue 3 (Composition API)
  • TypeScript
  • Vuetify 3
  • Pinia
  • Vue I18n
  • Vite

Backend

  • Rust
  • Tauri v2
  • Tauri Plugins (dialog, fs, notification, opener, os)

Development

Prerequisites

  • Node.js >= 24
  • pnpm >= 10
  • Rust >= 1.94
  • Tauri CLI

Setup

# Install dependencies
pnpm install

# Run development server
pnpm run dev:tauri

Build

# Build for production
pnpm run build:tauri

Customization

1. Configure Application Settings

Edit .env file to customize your application:

# Application Information
APP_NAME=Your App Name
APP_NAME_KEBAB=your-app-name
APP_DESCRIPTION=Your app description
APP_SUMMARY=Short summary

# Author Information
AUTHOR_NAME=Your Name
AUTHOR_EMAIL=your@email.com

# GitHub Repository
GITHUB_USER=username
GITHUB_REPO=repository-name

# URLs
VITE_PROJECT_URL=https://github.com/username/repository
HOMEPAGE_URL=https://yourdomain.com
DOCS_URL=https://yourdomain.com/docs

2. Update Package Metadata

The build scripts automatically generate package files from .env:

  • Chocolatey: .choco/app.nuspec.template โ†’ .choco/{APP_NAME_KEBAB}.nuspec
  • Homebrew: .homebrew/app.rb.template โ†’ .homebrew/{APP_NAME_KEBAB}.rb

3. Synchronize Version Numbers

After changing VERSION in .env, run the version sync script to update all configuration files:

Windows (PowerShell):

.\scripts\update-version.ps1

macOS/Linux (Bash):

./scripts/update-version.sh

This will automatically update:

  • frontend/package.json
  • backend/tauri.conf.json
  • backend/Cargo.toml

4. Other Customizations

  1. Replace icons in backend/icons/
  2. Customize frontend/src/components/MainContent.vue with your own logic
  3. Add your own Tauri commands in backend/src/command.rs
  4. Update localization files in frontend/src/locales/
  5. Edit backend/setup-vcpkg.sh and backend/setup-vcpkg.ps1 to statically link any vcpkg libraries your app needs

Project Structure

.
โ”œโ”€ frontend/                # Frontend (Vue 3 + Vite + Vuetify)
โ”‚  โ”œโ”€ src/
โ”‚  โ”‚  โ”œโ”€ components/         # UI components
โ”‚  โ”‚  โ”œโ”€ composables/        # Reusable logic (hooks)
โ”‚  โ”‚  โ”œโ”€ locales/            # i18n YAML files
โ”‚  โ”‚  โ”œโ”€ plugins/            # Vuetify, i18n, etc.
โ”‚  โ”‚  โ”œโ”€ store/              # Pinia stores
โ”‚  โ”‚  โ”œโ”€ styles/             # Global styles
โ”‚  โ”‚  โ””โ”€ types/              # Frontend types
โ”œโ”€ backend/                 # Rust backend (Tauri)
โ”‚  โ””โ”€ src/
โ”‚     โ”œโ”€ main.rs            # Tauri entry
โ”‚     โ”œโ”€ command.rs         # Tauri commands
โ”‚     โ”œโ”€ error.rs           # App error types
โ”‚     โ”œโ”€ logging.rs         # Logging helpers
โ”‚     โ””โ”€ lib.rs             # Public exports
โ”œโ”€ docs/                     # Documentation site (Nuxt)
โ”œโ”€ scripts/                  # Utility scripts (version sync, etc.)
โ”œโ”€ .env                      # App configuration
โ””โ”€ ReadMe.md                 # Project overview
  • frontend/src is the Vue frontend and UI logic.
  • backend/src is the Rust backend for Tauri commands.
  • docs is the static documentation site.

License

ยฉ2026 by Logue. Licensed under the MIT License.

This template is not officially endorsed by tauri.

๐ŸŽจ Crafted for Developers

This template is built with a focus on UI/UX excellence and modern developer experience. Maintaining it involves constant testing and updates to ensure everything works seamlessly.

If you appreciate the attention to detail in this project, a small sponsorship would go a long way in supporting my work across the Vue.js and Metaverse ecosystems.

GitHub Sponsors