use-dom

Execute web-only libraries and React components in Expo apps via webviews.

1|Updated Feb 24, 2026

Search Tags:#migration #webviews #react native #expo #web libraries #dom components

Ready to run

npx skills add https://github.com/xurenlu/marstaff --skill use-dom-xurenlu

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/xurenlu/marstaff/tree/main/skills/expo-use-dom
Command: npx skills add https://github.com/xurenlu/marstaff --skill use-dom-xurenlu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill allows developers to seamlessly integrate web-only libraries and existing React web code into their Expo applications, bridging the gap between web and native development.

Core Features & Use Cases

Web-only Libraries: Utilize libraries like recharts, react-syntax-highlighter, or any DOM-dependent React library directly within your Expo app.
Incremental Migration: Gradually migrate existing React web components to native platforms without a full rewrite.
Complex Layouts & Embeds: Handle intricate HTML/CSS layouts, iframes, and embeds that are challenging with standard React Native components.
Use Case: Embed a complex charting library like recharts to visualize data within your mobile app, or use a web-based rich text editor for a content creation feature.

Quick Start

Create a new file with the 'use dom'; directive at the top to define a DOM component.

Frequently Asked Questions about use-dom

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

FAQPage Schema

How do I use web libraries like recharts in an Expo app?▼

You can use web libraries like recharts in Expo by adding the 'use dom' directive to define a DOM component, which executes web code in a webview on native platforms while supporting serializable props for native-to-web communication.

What is the best way to migrate a React web codebase to React Native incrementally?▼

Incremental migration of a React web codebase to React Native is facilitated by running existing web components via webviews using the 'use dom' directive, allowing gradual adoption without a full rewrite of DOM-dependent functionalities.

Can I use DOM-dependent React components directly in Expo?▼

Yes, DOM-dependent React components can be used directly in Expo by creating a file with the 'use dom' directive, which runs the web code within webviews natively and directly on the web platform.

Does the 'use dom' directive support passing complex props to web components?▼

The 'use dom' directive supports serializable props to facilitate communication between native and web contexts, ensuring data can be passed correctly to web components running inside Expo webviews.

How do I handle complex HTML layouts and iframes in React Native?▼

Complex HTML layouts, CSS, and iframes that are challenging with standard React Native components can be handled by executing web code in Expo through webviews using the 'use dom' directive.

Are there limitations when running web-only libraries in Expo webviews?▼

Running web-only libraries in Expo webviews requires serializable props for native-web communication, meaning non-serializable data or functions cannot be directly passed across the native and web context boundary.