use-dom

Execute DOM components and web-only libraries within Expo webviews.

2.4k|125|Updated Nov 30, 2025
One-click install
npx skills add https://github.com/expo/skills --skill use-dom-expo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/expo/skills/tree/main/plugins/expo-app-design/skills/use-dom
Command: npx skills add https://github.com/expo/skills --skill use-dom-expo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill allows you to seamlessly integrate web-only libraries and existing React web code directly into your 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 within your Expo app.
  • Incremental Migration: Gradually migrate existing React web components to a native environment without a full rewrite.
  • Complex Layouts: Implement intricate HTML/CSS layouts that might be challenging with standard React Native components.
  • Use Case: Embed a complex charting library (like Recharts) or a rich text editor into your Expo app, which would otherwise require significant native code or be impossible to use directly.

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-only libraries like Recharts in an Expo app?

To use web-only libraries like Recharts in an Expo app, define a DOM component with the 'use dom'; directive to execute the web code inside a native webview. This bridges web libraries directly into your native environment.

Can I gradually migrate an existing React web codebase to React Native?

Yes, you can incrementally migrate existing React web components to a native environment without a full rewrite. You execute the web code directly within an Expo application's webview on native platforms.

Does the Expo DOM integration support CSS imports and native actions?

Yes, Expo DOM integration supports CSS imports and exposes native actions to the webview context. It also handles serializable props to enable seamless communication between the native and web layers.

What is the best way to render complex HTML layouts in Expo?

The best way to render complex HTML layouts in Expo is using DOM components. This allows you to implement intricate HTML and CSS layouts that might be challenging to build with standard React Native components.

Do I need a full rewrite to use DOM-dependent React libraries on native platforms?

No, you do not need a full rewrite to use DOM-dependent React libraries on native platforms. You can execute web code directly within your Expo application's webview to leverage existing web libraries.

Why use a webview to run web code in Expo instead of native components?

Using a webview to run web code in Expo allows you to utilize web-only libraries and implement complex HTML layouts. This bridges the gap between web and native development without rewriting existing web codebases.