When should I use platform-specific file extensions over Platform.OS?

Use file extensions (.web.tsx, .native.tsx) for significant differences in component logic or when using platform-exclusive libraries. Use Platform.OS for minor style adjustments or single-line logic checks.

How do I validate my code for cross-platform compliance?

The skill provides a validation checklist and a script-based validation process to ensure your code follows the established governance framework for all three platforms.

Can it detect APIs that won't work on the web?

Yes, it identifies common web-incompatible APIs like MediaLibrary, Haptics, and captureRef, suggesting appropriate alternatives or necessary platform checks.

Does this skill support Expo Router?

Yes, it includes specific rules for maintaining base versions of files in the app/ directory to ensure route universality across iOS, Android, and web.

Cross-Platform Expo Compatibility

Name: Cross-Platform Expo Compatibility
Author: CodySwannGT

byCodySwannGT

•

Mobile Development

Enforces best practices and implementation patterns to ensure Expo applications function seamlessly across iOS, Android, and web platforms.

This skill provides comprehensive guidance and automated enforcement for building truly universal Expo applications. It helps developers decide between runtime platform checks using Platform.OS and file-extension-based separation (.web.tsx, .native.tsx), ensuring that UI components, styles, and logic are optimized for each platform's unique constraints. By identifying web-incompatible APIs and providing standardized patterns for gestures, layouts, and hooks, it ensures high-quality, consistent performance regardless of the target device.

Key Features

01Guided decision-making between Platform.OS and platform-specific file extensions

02Cross-platform styling validation for shadows, elevations, and layout differences

03Detection and mitigation of web-incompatible APIs (MediaLibrary, Haptics, etc.)

04Automated validation for Expo Router universal routing requirements

051 GitHub stars

06Standardized implementation patterns for platform-specific hooks and components

Use Cases

01Implementing platform-sensitive logic such as file system access or push notifications

02Creating universal UI components that require platform-specific styling or interactions

03Migrating existing mobile-only Expo projects to support web and desktop environments

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add codyswanngt/lisa cross-platform-compatibility

For use in Claude.ai and ChatGPT

Key Features

01Guided decision-making between Platform.OS and platform-specific file extensions

02Cross-platform styling validation for shadows, elevations, and layout differences

03Detection and mitigation of web-incompatible APIs (MediaLibrary, Haptics, etc.)

04Automated validation for Expo Router universal routing requirements

051 GitHub stars

06Standardized implementation patterns for platform-specific hooks and components

Use Cases

01Implementing platform-sensitive logic such as file system access or push notifications

02Creating universal UI components that require platform-specific styling or interactions

03Migrating existing mobile-only Expo projects to support web and desktop environments

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add codyswanngt/lisa cross-platform-compatibility

For use in Claude.ai and ChatGPT