Add Tauri framework development skill
Created comprehensive Tauri skill for building desktop and mobile applications with Rust backend and web frontend. Skill Content: - Complete Tauri 2.0 framework coverage - Cross-platform development (Windows, macOS, Linux, iOS, Android) - IPC communication patterns (commands, events, bridges) - Security best practices (capabilities, permissions, CSP) - Native API integration (system tray, notifications, file system) - Build and distribution guidance (code signing, auto-updater) Files Created: - skill.md - Main skill with 6 slash commands - templates/ - tauri.conf.json - Config template with all options - capabilities/default.json - Basic permissions - capabilities/fs-full.json - File system access - capabilities/network.json - Network permissions - src-tauri/commands/mod.rs - Rust command templates - src-tauri/events.rs - Event emission examples - examples/ - command-invoking.txt - Frontend command patterns - event-listening.txt - Event handling patterns - plugin-usage.txt - 10+ plugin examples (fs, http, dialog, etc.) - mobile-setup.txt - iOS/Android development guide Slash Commands: - /tauri-init - Initialize new Tauri project - /tauri-add-plugin - Add Tauri plugin - /tauri-build - Build for specific platform - /tauri-capability - Create permission capability - /tauri-ipc - Design IPC interface - /tauri-native - Add native feature Integration: - Uses rust-patterns for backend code quality - Integrates with react-dev, vue, svelte for frontend - Leverages architecture skill for system design - Uses test-driven-development for testing Credits: - Proper attribution to Tauri Team and The Commons Conservancy - Links to official documentation and community resources - Credits core dependencies: WRY, TAO, Tauri CLI Planned via /brainstorm with comprehensive Ralph-validated design. Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
258
skills/tauri/examples/plugin-usage.txt
Normal file
258
skills/tauri/examples/plugin-usage.txt
Normal file
@@ -0,0 +1,258 @@
|
||||
# Tauri Plugin Usage Examples
|
||||
|
||||
## File System Plugin
|
||||
|
||||
### Read File
|
||||
```typescript
|
||||
import { readTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';
|
||||
|
||||
const contents = await readTextFile('config.json', {
|
||||
dir: BaseDirectory.AppConfig
|
||||
});
|
||||
|
||||
// Or with full path
|
||||
const contents = await readTextFile('/path/to/file.txt');
|
||||
```
|
||||
|
||||
### Write File
|
||||
```typescript
|
||||
import { writeTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';
|
||||
|
||||
await writeTextFile('output.txt', 'Hello, Tauri!', {
|
||||
dir: BaseDirectory.AppData
|
||||
});
|
||||
```
|
||||
|
||||
### List Directory
|
||||
```typescript
|
||||
import { readDir, BaseDirectory } from '@tauri-apps/plugin-fs';
|
||||
|
||||
const entries = await readDir('', {
|
||||
dir: BaseDirectory.Home
|
||||
});
|
||||
|
||||
entries.forEach(entry => {
|
||||
console.log(entry.name);
|
||||
});
|
||||
```
|
||||
|
||||
## HTTP Plugin
|
||||
|
||||
### GET Request
|
||||
```typescript
|
||||
import { fetch } from '@tauri-apps/plugin-http';
|
||||
|
||||
const response = await fetch('https://api.example.com/data');
|
||||
const data = await response.json();
|
||||
```
|
||||
|
||||
### POST Request
|
||||
```typescript
|
||||
const response = await fetch('https://api.example.com/create', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({ name: 'Tauri App' })
|
||||
});
|
||||
```
|
||||
|
||||
### With Options
|
||||
```typescript
|
||||
const response = await fetch('https://api.example.com/data', {
|
||||
method: 'GET',
|
||||
timeout: 30, // seconds
|
||||
headers: {
|
||||
'Authorization': 'Bearer token123'
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
## Dialog Plugin
|
||||
|
||||
### Open File Dialog
|
||||
```typescript
|
||||
import { open } from '@tauri-apps/plugin-dialog';
|
||||
|
||||
const selected = await open({
|
||||
multiple: false,
|
||||
filters: [{
|
||||
name: 'Text',
|
||||
extensions: ['txt', 'md']
|
||||
}]
|
||||
});
|
||||
|
||||
if (selected) {
|
||||
console.log('Selected:', selected);
|
||||
}
|
||||
```
|
||||
|
||||
### Save File Dialog
|
||||
```typescript
|
||||
import { save } from '@tauri-apps/plugin-dialog';
|
||||
|
||||
const filePath = await save({
|
||||
filters: [{
|
||||
name: 'JSON',
|
||||
extensions: ['json']
|
||||
}]
|
||||
});
|
||||
|
||||
if (filePath) {
|
||||
// Save file
|
||||
}
|
||||
```
|
||||
|
||||
### Message Dialog
|
||||
```typescript
|
||||
import { message } from '@tauri-apps/plugin-dialog';
|
||||
|
||||
await message('Operation completed successfully!', 'Info');
|
||||
```
|
||||
|
||||
## Notification Plugin
|
||||
|
||||
### Show Notification
|
||||
```typescript
|
||||
import { isPermissionGranted, requestPermission, sendNotification } from '@tauri-apps/plugin-notification';
|
||||
|
||||
// Check permission
|
||||
let permission = await isPermissionGranted();
|
||||
if (!permission) {
|
||||
permission = await requestPermission();
|
||||
}
|
||||
|
||||
// Send notification
|
||||
if (permission) {
|
||||
await sendNotification({
|
||||
title: 'Hello from Tauri!',
|
||||
body: 'This is a native notification'
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
## Shell Plugin
|
||||
|
||||
### Execute Command
|
||||
```typescript
|
||||
import { Command } from '@tauri-apps/plugin-shell';
|
||||
|
||||
const command = Command.create('ls', ['-la']);
|
||||
const output = await command.execute();
|
||||
|
||||
console.log('stdout:', output.stdout);
|
||||
console.log('stderr:', output.stderr);
|
||||
```
|
||||
|
||||
### Open External Program
|
||||
```typescript
|
||||
import { open } from '@tauri-apps/plugin-shell';
|
||||
|
||||
await open('https://tauri.app');
|
||||
await open('mailto:support@example.com');
|
||||
await open('/path/to/file.txt');
|
||||
```
|
||||
|
||||
## Clipboard Plugin
|
||||
|
||||
### Read Clipboard
|
||||
```typescript
|
||||
import { readText } from '@tauri-apps/plugin-clipboard-manager';
|
||||
|
||||
const text = await readText();
|
||||
console.log('Clipboard:', text);
|
||||
```
|
||||
|
||||
### Write to Clipboard
|
||||
```typescript
|
||||
import { writeText } from '@tauri-apps/plugin-clipboard-manager';
|
||||
|
||||
await writeText('Copied to clipboard!');
|
||||
```
|
||||
|
||||
## Global Shortcut Plugin
|
||||
|
||||
### Register Hotkey
|
||||
```typescript
|
||||
import { register, Shortcut } from '@tauri-apps/plugin-global-shortcut';
|
||||
|
||||
await register(Shortcut.Modifiers, 'CommandOrControl+Shift+X', () => {
|
||||
console.log('Hotkey pressed!');
|
||||
});
|
||||
```
|
||||
|
||||
### Unregister
|
||||
```typescript
|
||||
import { unregisterAll } from '@tauri-apps/plugin-global-shortcut';
|
||||
|
||||
await unregisterAll();
|
||||
```
|
||||
|
||||
## Updater Plugin
|
||||
|
||||
### Check for Updates
|
||||
```typescript
|
||||
import { checkUpdate, installUpdate } from '@tauri-apps/plugin-updater';
|
||||
|
||||
try {
|
||||
const { manifest, body } = await checkUpdate();
|
||||
|
||||
if (manifest) {
|
||||
console.log('Update available:', manifest.version);
|
||||
|
||||
// Install update
|
||||
await installUpdate();
|
||||
|
||||
// Restart app
|
||||
await relaunch();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Update check failed:', error);
|
||||
}
|
||||
```
|
||||
|
||||
## OS Plugin
|
||||
|
||||
### Platform Info
|
||||
```typescript
|
||||
import { platform, version, arch, tempdir } from '@tauri-apps/plugin-os';
|
||||
|
||||
console.log('Platform:', platform());
|
||||
console.log('Version:', version());
|
||||
console.log('Architecture:', arch());
|
||||
console.log('Temp dir:', tempdir());
|
||||
```
|
||||
|
||||
## Window Management
|
||||
|
||||
### Window Controls
|
||||
```typescript
|
||||
import { getCurrentWindow } from '@tauri-apps/api/window';
|
||||
|
||||
const window = getCurrentWindow();
|
||||
|
||||
await window.setTitle('New Title');
|
||||
await window.setMaximizable(false);
|
||||
await window.setResizable(true);
|
||||
await window.minimize();
|
||||
await window.maximize();
|
||||
await window.unmaximize();
|
||||
await window.close();
|
||||
```
|
||||
|
||||
### Window Events
|
||||
```typescript
|
||||
import { getCurrentWindow } from '@tauri-apps/api/window';
|
||||
|
||||
const window = getCurrentWindow();
|
||||
|
||||
window.onResized(({ payload }) => {
|
||||
console.log('New size:', payload);
|
||||
});
|
||||
|
||||
window.onFileDropEvent((event) => {
|
||||
event.payload.paths.forEach(path => {
|
||||
console.log('Dropped:', path);
|
||||
});
|
||||
});
|
||||
```
|
||||
Reference in New Issue
Block a user