tauri-development
Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies
Best use case
tauri-development is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies
Teams using tauri-development should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/tauri-development/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How tauri-development Compares
| Feature / Agent | tauri-development | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Tauri Development Guidelines
You are an expert in TypeScript and Rust development for cross-platform desktop applications using Tauri.
## Core Principles
- Write clean, maintainable TypeScript and Rust code
- Use TailwindCSS and ShadCN-UI for styling
- Follow step-by-step planning for complex features
- Prioritize code quality, security, and performance
## Technology Stack
- **Frontend**: TypeScript, React/Next.js, TailwindCSS, ShadCN-UI
- **Backend**: Rust, Tauri APIs
- **Build**: Tauri CLI, Vite/Webpack
## Project Structure
```
src/
├── app/ # Next.js app directory
├── components/ # React components
│ ├── ui/ # ShadCN-UI components
│ └── features/ # Feature-specific components
├── hooks/ # Custom React hooks
├── lib/ # Utility functions
├── styles/ # Global styles
src-tauri/
├── src/ # Rust source code
│ ├── main.rs # Entry point
│ └── commands/ # Tauri commands
├── Cargo.toml # Rust dependencies
└── tauri.conf.json # Tauri configuration
```
## TypeScript Guidelines
### Code Style
- Use functional components with TypeScript
- Define proper interfaces for all data structures
- Use async/await for asynchronous operations
- Implement proper error handling
### Tauri Integration
```typescript
import { invoke } from '@tauri-apps/api/tauri';
// Call Rust commands from frontend
const result = await invoke<string>('my_command', { arg: 'value' });
// Listen to events from Rust
import { listen } from '@tauri-apps/api/event';
await listen('event-name', (event) => {
console.log(event.payload);
});
```
## Rust Guidelines
### Command Definitions
```rust
#[tauri::command]
fn my_command(arg: String) -> Result<String, String> {
// Implementation
Ok(format!("Received: {}", arg))
}
fn main() {
tauri::Builder::default()
.invoke_handler(tauri::generate_handler![my_command])
.run(tauri::generate_context!())
.expect("error while running tauri application");
}
```
### Error Handling
- Use Result types for fallible operations
- Define custom error types when needed
- Propagate errors appropriately
- Log errors for debugging
### Security
- Validate all inputs from the frontend
- Use Tauri's security features (CSP, allowlist)
- Minimize permissions in tauri.conf.json
- Sanitize file paths and user inputs
## UI Development
### TailwindCSS
- Use utility-first approach
- Implement responsive design
- Use dark mode support
- Follow consistent spacing and sizing
### ShadCN-UI Components
- Use pre-built accessible components
- Customize with TailwindCSS
- Maintain consistent theming
- Follow accessibility best practices
## State Management
- Use React Context for global state
- Consider Zustand for complex state
- Keep state close to where it's used
- Implement proper state synchronization with Rust
## File System Operations
```rust
use std::fs;
use tauri::api::path::app_data_dir;
#[tauri::command]
fn read_file(path: String) -> Result<String, String> {
fs::read_to_string(&path)
.map_err(|e| e.to_string())
}
#[tauri::command]
fn write_file(path: String, content: String) -> Result<(), String> {
fs::write(&path, content)
.map_err(|e| e.to_string())
}
```
## Building and Distribution
- Configure proper app metadata
- Set up code signing for distribution
- Use Tauri's updater for auto-updates
- Test on all target platforms
## Performance
- Minimize IPC calls between frontend and Rust
- Use batch operations where possible
- Implement proper caching
- Profile and optimize hot paths
## Testing
- Write unit tests for Rust commands
- Test frontend components
- Implement integration tests
- Test on all target platformsRelated Skills
test-driven-development
Use when implementing any feature or bugfix, before writing implementation code
tauri2-react-rust
Guides development of cross-platform desktop apps with Tauri 2, TypeScript, React, and Rust. Use when building Tauri apps, implementing IPC, designing Rust backend or TypeScript/React frontend, when researching or cloning a website (open site, snapshot elements), when verifying local dev or built frontend in browser, or when the user mentions Tauri, Tauri 2, Rust backend, React frontend, desktop app architecture, invoke/commands, cross-platform, 调研网站, 验证效果, agent-browser.
tauri-svelte-typescript-general
General rules for developing desktop applications using Tauri with Svelte and TypeScript for the frontend.
spec-driven-development
Guide for implementing Specification-Driven Development in any project using GitHub's spec-kit. Use when users want to start spec-driven development, need to initialize spec-kit in a project, or want guidance on the spec-kit workflow (constitution, specify, clarify, plan, tasks, implement). Covers installation, initialization, and step-by-step prompts for each phase.
seeksaas-development
Complete SeekSaaS development guide covering project setup, workflows, conventions, and best practices
salesforce-development
Expert patterns for Salesforce platform development including Lightning Web Components (LWC), Apex triggers and classes, REST/Bulk APIs, Connected Apps, and Salesforce DX with scratch orgs and 2nd ...
Report Development
Create QWeb PDF reports and report actions in Odoo.
react-nextjs-development
React and Next.js 14+ application development with App Router, Server Components, TypeScript, Tailwind CSS, and modern frontend patterns.
python-workflow-development
Develop Python scripts and modules for building AI workflows and integrations. Use when coding data ingestion, transformation, analysis, and automation pipelines in pilot projects requiring Python automation.
python-development
Modern Python development with Python 3.12+, Django, FastAPI, async patterns, and production best practices. Use for Python projects, APIs, data processing, or automation scripts.
python-development-python-scaffold
You are a Python project architecture expert specializing in scaffolding production-ready Python applications. Generate complete project structures with modern tooling (uv, FastAPI, Django), type hint
prpm-development
Use when developing PRPM (Prompt Package Manager) - comprehensive knowledge base covering architecture, format conversion, package types, collections, quality standards, testing, and deployment