capacitor-ios
Installation
SKILL.md
Three.js Capacitor iOS
Ship a Three.js + Vite app in an iOS native shell via Capacitor. Two runtimes — web renderer (Three.js + Vite) and native wrapper (Capacitor iOS) — must agree on an explicit, testable contract: web output dir, animation names, build output, iOS package manager. Most breakage is an implicit contract.
Before implementing, confirm:
- Web output dir (
distorwww) matches CapacitorwebDir. - Animation names come from data (
assets_index.json), not hardcoded strings. - iOS uses SPM (default on Capacitor 8+) unless a plugin forces CocoaPods.
- Mouse and touch controls are mapped intentionally, not left to defaults.
Quick Start Workflow
- Build with Vite (
npm run build). - Keep static assets under
public/and load via absolute URLs (/assets/...). - Configure Capacitor with
webDir: "dist". - Add iOS with SPM:
npx cap add ios --packagemanager SPM. - Day-to-day loop:
npm run build→npx cap sync ios→npx cap run ios(ornpx cap open ios).