/tauri-dioxus-tailwind-template

Primary LanguageRust

Tauri + Dioxus + Tailwind CSS Template

A modern, batteries-included template for building desktop applications with Tauri, Dioxus, and Tailwind CSS.

Features

  • 🚀 Tauri 2.0 - Latest version with improved performance and security
  • 🦀 Dioxus 0.6 - Reactive UI framework for Rust
  • 🎨 Tailwind CSS - Utility-first CSS framework with dark mode support
  • 🔧 Pre-configured - All the configuration issues are already fixed
  • 📦 Cargo Generate - Easy project scaffolding

Prerequisites

  • Rust 1.70 or higher
  • Node.js 16 or higher (for Tailwind CSS)
  • cargo-generate: cargo install cargo-generate
  • Dioxus CLI: cargo install dioxus-cli

Quick Start

Generate a new project

cargo generate --git https://github.com/codeitlikemiley/tauri-dioxus-tailwind-template

Start Tailwind CSS watcher (in a separate terminal)

tailwind -i ./input.css -o ./assets/tailwind.css --watch

Run the development server

cargo tauri dev

Important Configuration Notes

This template includes several important fixes:

  1. Non-interactive dx serve: The beforeDevCommand uses -i false flag to prevent the dx serve from hanging
  2. Correct port configuration: Both Dioxus and Tauri are configured to use port 1420
  3. Tailwind CSS integration: Pre-configured with dark mode support

Project Structure

your-project/
├── src/                    # Dioxus frontend code
│   ├── main.rs            # Entry point
│   └── app.rs             # Main app component
├── src-tauri/             # Tauri backend code
│   ├── src/
│   │   ├── main.rs        # Tauri entry point
│   │   └── lib.rs         # Tauri commands
│   ├── icons/             # App icons
│   └── tauri.conf.json    # Tauri configuration
├── assets/                # Static assets
├── dist/                  # Build output
├── Cargo.toml             # Rust dependencies
├── Dioxus.toml           # Dioxus configuration
├── tailwind.config.js    # Tailwind configuration
└── package.json          # Node dependencies

Troubleshooting

dx serve hangs

This template already includes the fix (-i false flag), but if you still have issues:

  1. Make sure no other process is using port 1420
  2. Try running dx serve --port 1420 -i false manually

Cargo.lock version issues

If you see errors about Cargo.lock version, change the version in Cargo.lock from 4 to 3.

Missing WASM target

Install the WASM target:

rustup target add wasm32-unknown-unknown

License

This template is open source and available under the MIT License.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.