๐ A boilerplate for native applications with Tauri and Xcode using TypeScript on Vite.
๐ View Demo: Live | Windows | macOS | Android | iOS
Source Code: Web-side | Native-side | Server-side | Cloud-side
- Getting Started
- Project Setup
- Key Features
- Configuration
- Directory Structure
Prerequisites:
- Node.js v20
- PNPM v9
- Tauri v2
Get started with Tauri Starter.
# install dependencies
$ pnpm install
# dev server (in one terminal)
# the default is to run it on macOS
$ pnpm dev:mobile
# or
$ pnpm dev:desktop
# mock server (in another terminal)
$ pnpm mock
Or use barebones scaffolding for your new Tauri app
$ pnpm dlx degit Shyam-Chen/Barebones-Templates/tauri my-tauri-app
Follow steps to execute this boilerplate.
$ pnpm install
$ sudo xcode-select -s /Applications/Xcode.app/Contents/Developer
$ xcrun -f devicectl
$ pnpm tauri ios init
# Xcode -> Open Developer Tool -> Simulator -> File -> Open Simulator -> iPhone Pro
$ pnpm tauri ios dev
# Detected iOS simulators:
# [1] iPhone
# [2] iPhone Plus
# [3] iPhone Pro
# [4] iPhone Pro Max
# Enter an index for a simulator above.
# Simulator: 3
$ pnpm clean:ios
$ pnpm tauri ios init
$ pnpm tauri ios build
$ pnpm tauri dev
$ pnpm tauri build
$ cd Library/Android/sdk/ndk/
$ ls
# 26.2.11394342
export NDK_HOME="$ANDROID_HOME/ndk/26.2.11394342"
$ pnpm tauri android init
$ pnpm tauri android dev
# select emulator
$ pnpm clean:android
$ pnpm tauri android init
$ pnpm tauri android build
$ pnpm mock
This seed repository provides the following features:
- ---------- Essentials ----------
- Tauri - Native Apps Framework
- Vue - User Interface Framework
- Router - Routing
- Routes - File-based Routing
- Storer - State Management
- Formor - Form Validation
- Valibot - Schema Validation
- Localer - Internationalization and Localization
- Use - Composition Utilities
- Qrcode Image - QR Code Generation
- Lodash - JavaScript Utilities
- Date Fns - Date Utilities
- UnoCSS - CSS Utilities
- Iconify - Icon Utilities
- Tiptap - Rich Text Editor
- ECharts - Data Visualization
- ---------- Tools ----------
- Vite - Bundler
- TypeScript - JavaScript with Syntax for Types
- Sassy CSS - CSS Extension
- Biome - Formatter and Linter
- ESLint - Linter
- Prettier - Formatter
- Vitest - Test Runner
- WebdriverIO - Test Automation
- Appium - WebDriver Protocol Mobile Test Automation
- ---------- Environments ----------
- Node.js - JavaScript Runtime Environment
- Pnpm - Package Manager
- GitHub Actions - Continuous Integration and Delivery
- Tauri GitHub Action - Native Binary
The structure follows the LIFT Guidelines.
.
โโโ .github/workflows
โ โโโ ci.yaml
โ โโโ publish.yaml
โโโ app
โ โโโ public
โ โโโ src
โ โ โโโ assets
โ โ โโโ components
โ โ โโโ composables
โ โ โโโ layouts
โ โ โโโ locales
โ โ โโโ middleware
โ โ โโโ plugins
โ โ โโโ routes
โ โ โโโ utilities
โ โ โโโ workers
โ โ โโโ App.vue
โ โ โโโ main.ts
โ โ โโโ shims.d.ts
โ โโโ index.html
โ โโโ package.json
โ โโโ tsconfig.json
โ โโโ vite.config.ts
โโโ docs -> Write documentation with VitePress
โ โโโ .vitepress
โ โโโ index.md
โ โโโ package.json
โ โโโ vite.config.ts
โโโ e2e -> End-to-end testing
โ โโโ src
โ โโโ package.json
โ โโโ playwright.config.ts
โ โโโ tsconfig.json
โโโ mock -> Mock backend API
โ โโโ src
โ โโโ package.json
โ โโโ tsconfig.json
โ โโโ vite.config.ts
โโโ ui -> Design system
โ โโโ src
โ โโโ package.json
โ โโโ tsconfig.json
โ โโโ vite.config.ts
โโโ .editorconfig
โโโ .gitignore
โโโ eslint.config.js
โโโ package.json
โโโ pnpm-lock.yaml
โโโ pnpm-workspace.yaml
โโโ prettier.config.js
โโโ README.md