cross-platform

Isolate platform-specific code using file extensions and a centralized platformEnv utility.

3|2|Updated Feb 11, 2026
One-click install
npx skills add https://github.com/Paxeer-Network/Sidiora-Perpetual-Protocol --skill cross-platform-paxeer-network
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cross-platform
Source: https://github.com/Paxeer-Network/Sidiora-Perpetual-Protocol/tree/main/.windsurf/skills/cross-platform
Command: npx skills add https://github.com/Paxeer-Network/Sidiora-Perpetual-Protocol --skill cross-platform-paxeer-network

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides patterns and tools for writing code that works seamlessly across different operating systems and environments like web, mobile, desktop, and browser extensions.

Core Features & Use Cases

  • Platform-Specific File Extensions: Use .native.ts, .web.ts, .desktop.ts, .ext.ts to isolate platform code.
  • Centralized Platform Detection: Utilize platformEnv for reliable checks instead of manual environment variable checks.
  • Use Case: Develop a single application that displays a user interface differently on a mobile app versus a web browser, while sharing core business logic.

Quick Start

Use the cross-platform skill to write code that detects if the current environment is native mobile.

Frequently Asked Questions about cross-platform

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I share business logic across React Native and web applications?

Share business logic across React Native and web applications by isolating platform-specific code using standardized file extensions like `.native.ts` and `.web.ts`. This cross-platform development approach ensures consistent application behavior across environments.

What is the best way to detect platform environments in an Electron desktop app?

The best way to detect platform environments in an Electron desktop app is using a centralized `platformEnv` utility. This provides reliable conditional logic checks instead of relying on manual environment variable checks, ensuring accurate platform detection across web and desktop contexts.

Can I use file extension naming conventions for browser extension code isolation?

Yes, you can use `.ext.ts` file extension naming conventions to isolate browser extension code. This cross-platform pattern allows you to separate extension-specific logic from shared codebases, maintaining consistent behavior across React Native, web, and Electron desktop platforms.

Why does my cross-platform code fail when switching between mobile and web browsers?

Cross-platform code often fails when switching between mobile and web browsers due to manual environment variable checks. Using a centralized `platformEnv` utility for reliable platform detection ensures consistent conditional logic execution across different operating systems and application environments.

Do I need separate codebases for a mobile app and a browser extension?

You do not need separate codebases for a mobile app and a browser extension. By leveraging platform-specific file extensions like `.native.ts` and `.ext.ts`, you can maintain a single application codebase while isolating platform-specific code for each environment.

How does platform-specific file extension isolation work in cross-platform development?

Platform-specific file extension isolation works in cross-platform development by appending extensions like `.desktop.ts` or `.web.ts` to filenames. This automatically routes the correct platform code during compilation, separating user interface logic while sharing core business logic.