mpx-rn-style-guide

Name: mpx-rn-style-guide
Author: didi/mpx

About mpx-rn-style-guide

Style adaptation development guide for Mpx cross-platform output to RN (referred to as Mpx2RN or Mpx2DRN). Must be invoked when the user's question or context contains all three key elements of Mpx, RN, and styles, e.g. Mpx2RN style adaptation, Mpx2RN style errors. Should not be invoked when the user's question does not involve Mpx cross-platform output to RN or is unrelated to styles, e.g. Mpx mini program output issues, RN-related issues.

Install

Copy the command and run it in a terminal.

$npx skills add https://didi/mpx --skill mpx-rn-style-guide

After installing, type/mpx-rn-style-guidein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

references/

conditional-compile.md

rn-api-reference.md

rn-hybrid-dev.md

rn-json-reference.md

rn-script-reference.md

rn-style-practice.md

rn-style-reference.md

rn-template-reference.md

single-file-component.md

scripts/

compile-validate.js

strip-using-components-loader.js

Comments

Markdown supported

Details

Author: didi/mpx
Category: Development
Installs: 71

Report

More skills

All skills

remotion-render

github.com/inference-sh

1.6M

Render videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video

improve-codebase-architecture

github.com/mattpocock

1.2M

Scan a codebase for architecture improvement opportunities, present them as a visual HTML report, then dive deep into whichever one you pick.

design-mobile-apps

github.com/designed-by-ai

1.1M

Design mobile app screens with Sleek, edit Sleek projects, and implement their designs in React Native or HTML

vercel-react-best-practices

github.com/vercel-labs

855.5k

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.