AIKraft/AI/Войти
AIKraft/Skills/expo dom

expo dom

Framework (OSS). Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally. For the end-to-end migration of a whole web app, use the expo-web-to-native skill.

expo official Разработка

Что делает навык

DOM Components позволяют запускать веб-код без изменений в WebView на нативных платформах и в том же виде в вебе. Это решает задачу использования веб-библиотек и миграции существующего React-кода на нативные платформы без переписывания.

Когда применять

  • Использование веб-специфичных библиотек, таких как recharts, chart.js или react-syntax-highlighter
  • Миграция существующих React-компонентов с веба на нативные платформы без переписывания
  • Создание сложных HTML/CSS-макетов, для которых недоступны функции CSS в React Native
  • Встраивание внешних контентов через iframes, требующих контекста браузера
  • Использование веб-API графики, таких как Canvas или WebGL

Как работает

  1. Импортировать DOM Components в проект Expo
  2. Заменить нативные компоненты на DOM-компоненты для участков кода, требующих веб-контекста
  3. Обеспечить, чтобы веб-код выполнялся верbatim (без изменений) в WebView на нативных платформах
  4. Обеспечить, чтобы тот же код рендерился как есть в веб-среде
  5. Использовать библиотеки, зависящие от DOM API, без модификации

Примеры запросов агенту

Как использовать recharts в Expo приложении для Android и iOS?
Мигрировать существующий React веб-компонент с использованием DOM Components
Встроить iframe с внешним контентом в нативное приложение Expo

Что понадобится

  • Экосистема Expo
  • React Native
  • Доступ к DOM API (для веб-среды)

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «expo-dom» из репозитория: # https://github.com/expo/skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r expo-dom/ ~/.claude/skills/expo-dom/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.