
capacitor-platforms
Guides the agent through adding, configuring, and using the Capawesome desktop platforms for Capacitor — @capawesome/capacitor-electron and @capawesome/capacitor-tauri. Covers choosing between Electron and Tauri, installation and scaffolding, sync/run workflows, live reload, deep links, plugin compatibility (Electron plugin implementations and web fallback; Tauri plugin tiers), packaging, and app updates. Do not use for the Android or iOS platforms, installing individual Capacitor plugins, migrating Capacitor apps or plugins to newer versions, or non-Capacitor desktop frameworks.
- Installs
- 604
- Last 24h
- +107
- Trending rank
- #1907
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/capawesome-team/skills --skill capacitor-platforms- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads capacitor-platforms automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
Capacitor Platforms (Desktop)
Bring a Capacitor app to macOS, Windows, and Linux with the Capawesome desktop platforms: @capawesome/capacitor-electron and @capawesome/capacitor-tauri. Both use the standard Capacitor workflow (cap add / cap sync / cap run), report Capacitor.isNativePlatform() as true, and deliver deep links through the standard @capacitor/app events.
Prerequisites
| Requirement | Electron | Tauri |
|---|---|---|
| Node.js | LTS (18+) | LTS (18+) |
| Capacitor | 6+ | 8+ |
| Electron | >= 28 (installed by the scaffold) | — |
| Rust toolchain + system dependencies | — | Required — see the Tauri prerequisites guide |
On Capacitor 6 and 7, the Capacitor CLI ignores the exit code of platform hooks — a failing npx cap sync still reports success. Check the log output for [capacitor-electron] errors. Capacitor 8 fails the command properly.
Agent Behavior
- Auto-detect before asking. Read
package.jsonand the Capacitor config to determine installed platforms and plugins before prompting the user. - Help choose the platform first. If the user has not committed to Electron or Tauri, apply Step 1 — plugin requirements usually decide it.
- Always use the full package name with Capacitor CLI commands (e.g.
npx cap sync @capawesome/capacitor-electron). A barenpx cap sync electronornpx cap sync taurisilently does nothing. - Check plugin compatibility early. On Tauri, list the app's Capacitor plugins and verify each is covered by a web implementation or a curated shim (see
references/tauri.md) before recommending it.
MCP Servers
Two hosted MCP servers serve the current documentation, so both are always ahead of the guidance bundled with this skill:
- Capawesome MCP server — the Capawesome plugins, the Capawesome CLI, and Capawesome Cloud.
- Capacitor MCP server (unofficial) — Capacitor itself: the CLI, the
capacitor.configfile, the native Android and iOS projects, and the official plugin APIs.
Both expose search_docs and get_doc_page, so pick the server by topic before calling either.
- If the MCP tools are available, call
search_docson the server that owns the topic and read the matching page withget_doc_pagebefore applying the guidance below. Where the two disagree, follow the documentation. - If they are not available, mention once that the servers can be added with the commands below, then continue with this skill. Never block on it.
claude mcp add --transport http capawesome "https://mcp.capawesome.io/mcp"
claude mcp add --transport http capacitor "https://capacitor-mcp.capawesome.io/mcp"
Neither server needs an account or a token for documentation. See the capawesome-mcp and capacitor-mcp skills for full setup, including the Capawesome Cloud tools.
Procedures
Step 1: Choose a Platform
| The app needs… | Choose |
|---|---|
| Reuse of Capacitor plugins with native (Node) desktop implementations | Electron |
| Web-bundle over-the-air updates | Electron (Capawesome Cloud Live Updates via @capawesome/capacitor-live-update >= 8.5.0, requires Capacitor 8 — see references/electron.md; Tauri compiles web assets into the binary — only full signed binary updates) |
| A single, predictable bundled Chromium across all OSes | Electron |
| Smallest binaries (~3–10 MB vs ~85–120 MB) and lowest memory use | Tauri |
| A deny-by-default security model with a Rust core | Tauri |
| No Rust toolchain in dev/CI | Electron |
Tauri's trade-offs are inherent, not bugs: no Node runtime (so no arbitrary Capacitor plugin reuse), three different system webviews (WKWebView/WebView2/WebKitGTK), no web-bundle OTA, and a required Rust toolchain. If in doubt, read the Honest Limitations section of the Tauri platform README.
Step 2: Install and Add the Platform
Electron:
npm install @capawesome/capacitor-electron
npx cap add @capawesome/capacitor-electron
cd electron && npm install && cd ..
Then add a postinstall script to the app's root package.json so the Electron dependencies are always installed together with the main app dependencies:
{
"scripts": {
"postinstall": "cd electron && npm ci && cd .."
}
}
Tauri (verify rustc --version works first; if not, stop and walk the user through the Tauri prerequisites):
npm install @capawesome/capacitor-tauri
npx cap add @capawesome/capacitor-tauri
Both scaffolds contain only files the user owns (config, icons, a few-line entry point); all runtime logic lives in the versioned package/crate and updates via npm update / cargo update.
Step 3: Sync and Run
npx cap sync @capawesome/capacitor-electron # or @capawesome/capacitor-tauri
npx cap run @capawesome/capacitor-electron # or @capawesome/capacitor-tauri
Electron sync copies web assets and regenerates the plugin manifest. Tauri sync additionally scans the app's Capacitor plugin dependencies and generates a deny-by-default capability file, the curated tauri-plugin-* crate dependencies, and the Rust plugin registrations.
For live reload on either platform, set server.url in the Capacitor config to the local dev server and run the platform — see the platform reference for details.
Step 4: Configure
- Electron: typed options in
electron/capacitor.electron.config.ts(window, CSP, deep links, hooks) — seereferences/electron.md. - Tauri:
src-tauri/tauri.conf.json(window, CSP, deep links viaplugins.deep-link.desktop.schemes, bundle) — seereferences/tauri.md.
Step 5: Package for Distribution
- Electron:
cd electron && npm run pack(electron-builder; vendors the runtime and plugin implementations automatically) — seereferences/electron.md. - Tauri:
npx cap sync @capawesome/capacitor-tauri && npx tauri build(native installers per OS) — seereferences/tauri.md.
References
references/electron.md— scaffold layout, configuration, live reload, deep links, plugin support and plugin development contract, packaging and vendoring, app updates (binary updates and Live Updates), migration from@capacitor-community/electron.references/tauri.md— Rust prerequisites, scaffold layout, sync-time codegen, the plugin tier model (built-in / curated / web fallback), configuration, live reload, deep links, packaging, honest limitations.
Related Skills
capacitor-app-creation— Create a new Capacitor app before adding a desktop platform.capacitor-app-development— General Capacitor development topics, configuration, and troubleshooting.capacitor-plugins— Install and configure Capacitor plugins, including checking desktop platform support.capawesome-cloud— Set up Capawesome Cloud Live Updates for the Electron platform (same app and config as Android/iOS).capawesome-mcp— Connect an MCP client to the hosted Capawesome MCP server for always-current documentation and Capawesome Cloud management.
FAQ
What does the capacitor-platforms skill do?
Guides the agent through adding, configuring, and using the Capawesome desktop platforms for Capacitor — @capawesome/capacitor-electron and @capawesome/capacitor-tauri. Covers choosing between Electron and Tauri, installation and scaffolding, sync/run workflows, live reload, deep links, plugin compatibility (Electron plugin implementations and web fallback; Tauri plugin tiers), packaging, and app updates. Do not use for the Android or iOS platforms, installing individual Capacitor plugins, migrating Capacitor apps or plugins to newer versions, or non-Capacitor desktop frameworks.
How do I install capacitor-platforms?
Run npx skills add https://github.com/capawesome-team/skills --skill capacitor-platforms in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/capacitor-platforms/ (personal) or .claude/skills/capacitor-platforms/ (project).
Which AI agents can use capacitor-platforms?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is capacitor-platforms safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains capacitor-platforms?
It is published by capawesome-team in capawesome-team/skills. It has 604 recorded installs.
More from capawesome-team/skills
capacitor-plugins
capawesome-team/skills
Guides the agent through installing, configuring, and using Capacitor plugins from six sources — official Capacitor plugins, Capawesome plugins, Capacitor Community plugins, Capacitor Firebase plugins, Capacitor MLKit plugins, and RevenueCat plugins. Covers installation, platform-specific configuration (Android and iOS), and basic usage examples. Do not use for migrating Capacitor apps or plugins to a newer version, setting up Capacitor Live Updates, or non-Capacitor mobile frameworks.
ionic-angular
capawesome-team/skills
Guides the agent through Angular-specific patterns for Ionic app development. Covers project structure, standalone vs NgModule architecture detection, Angular Router integration with Ionic navigation (tabs, side menu, modals), lazy loading, Ionic page lifecycle hooks, reactive forms with Ionic input components, Angular services for state management, route guards, performance optimization, and testing. Do not use for creating a new Ionic app from scratch, upgrading Ionic versions, general Ionic component usage unrelated to Angular, Capacitor plugin integration, or non-Angular frameworks (React, Vue).
ionic-expert
capawesome-team/skills
A comprehensive starting point for AI agents to work with the Ionic Framework. Covers core concepts, components, CLI, theming, layout, lifecycle, navigation, and framework-specific patterns for Angular, React, and Vue. Pair with the other Ionic skills in this collection for deeper topic-specific guidance like app creation, framework integration, and upgrades.
ionic-app-development
capawesome-team/skills
Guides the agent through general Ionic Framework development including core concepts, component reference, CLI usage, layout, theming, animations, gestures, development workflow, and troubleshooting. Covers all Ionic UI components grouped by category with properties, events, methods, slots, and CSS custom properties. Do not use for creating a new Ionic app (use ionic-app-creation), framework-specific patterns (use ionic-angular, ionic-react, ionic-vue), or upgrading Ionic versions (use ionic-app-upgrades).
capacitor-app-development
capawesome-team/skills
Guides the agent through general Capacitor app development topics. Covers core concepts (native bridge, plugins, web layer), Capacitor CLI usage, app configuration (capacitor.config.ts, splash screens, app icons, deep links), platform management (Android, iOS, Electron, PWA), edge-to-edge and safe area handling on Android, live reload setup, storage solutions, file handling, security best practices, CI/CD references, iOS package managers (SPM, CocoaPods), and troubleshooting for Android and iOS. Do not use for creating new Capacitor apps, Capacitor plugin APIs, creating Capacitor plugins, in-app purchases, upgrading Capacitor versions, Cordova or PhoneGap migration, or framework-specific patterns (Angular, React, Vue).
capacitor-expert
capawesome-team/skills
A comprehensive starting point for AI agents to work with Capacitor. Covers core concepts, CLI, app creation, plugins, framework integration, best practices, storage, security, testing, troubleshooting, upgrading, and Capawesome Cloud (live updates, native builds, app store publishing). Pair with the other Capacitor skills in this collection for deeper topic-specific guidance.
Popular mobile skills
design-mobile-apps
designed-by-ai/skills
Design mobile app screens with Sleek, edit Sleek projects, and implement their designs in React Native or HTML.
ios-design
uizze.sh
Design and review iOS UI/UX for iPhone apps in SwiftUI, UIKit, or React Native. Use for mobile app design, screen redesigns, navigation flows, typography, forms, keyboard and safe-area layout, and accessibility checks. Apply Apple Human Interface Guidelines and consult real product references through the optional Uizze connection.
vercel-react-native-skills
vercel-labs/agent-skills
React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.
animate-expo
emilkowalski/skills
Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread it runs on, which properties, spring or timing, how the gesture hands off, how it degrades. Writes the implementation with Reanimated, Gesture Handler, Expo Router and expo-haptics. Use when animating anything in an Expo app, adding gestures, sheets, screen transitions, press feedback or haptics, or fixing motion that stutters on device. For web animation use animate.
xcode-project-setup
firebase/agent-skills
Safely modifies Xcode projects (.pbxproj) to add Swift Packages and link files. Use this skill whenever an iOS project needs dependencies installed (e.g. Firebase, Alamofire).
firebase-remote-config-basics
firebase/agent-skills
Manages Firebase Remote Config templates, feature flags, loading strategies, and SDKs (Android, iOS). Use when downloading/deploying remoteconfig JSON templates, managing version history/feature flags, setting in-app defaults, fetchAndActivate(), real-time listeners, or SDK setup. Don't use for Firebase Hosting, Auth, Firestore, Data Connect, Crashlytics, or App Hosting.