React + TypeScript + Tauri + Vite

This template provides a minimal setup to get React working with Tauri, Vite, TypeScript, HMR, and ESLint support.

Recommended IDE Setup

• VS Code
• Tauri Extension
• Rust Analyzer
• ES7+ React/Redux snippets

Prerequisites

Before running the project, install:

Rust

Install Rust using:

curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh

Verify installation:

rustc --version
cargo --version

Node.js

Install the latest LTS version from:

• https://nodejs.org

Verify installation:

node -v
npm -v

Tauri System Dependencies

Follow the official setup guide for your OS:

• https://tauri.app/start/prerequisites/

---

Install Dependencies

Using npm:

npm install

Using pnpm:

pnpm install

Using yarn:

yarn

---

Development

Start the Vite frontend:

npm run dev

Run the Tauri desktop application:

npm run tauri dev

---

Build

Build the frontend:

npm run build

Build the Tauri desktop app:

npm run tauri build

The generated installers/binaries will be available in:

src-tauri/target/release/bundle

---

Project Structure

.
├── src/                # React frontend source
├── src-tauri/          # Tauri backend (Rust)
├── public/             # Static assets
├── package.json
├── vite.config.ts
├── tsconfig.json
└── tauri.conf.json

---

Useful Scripts

Command	Description
npm run dev	Start Vite dev server
npm run build	Build frontend
npm run preview	Preview production build
npm run tauri dev	Run Tauri app in development
npm run tauri build	Build production desktop app

---

ESLint

You can enable stricter type-aware linting by updating your ESLint config:

export default defineConfig([
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      tseslint.configs.recommendedTypeChecked,
      // or
      tseslint.configs.strictTypeChecked,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
])

---

Learn More

• Tauri Documentation
  https://tauri.app

• React Documentation
  https://react.dev

• Vite Documentation
  https://vitejs.dev

• TypeScript Documentation
  https://www.typescriptlang.org

---

Happy coding 🚀