开发与工程 exporeact-nativeweb-to-native-migrationexpo-routerexpo-domiosandroid

Expo Web 转原生迁移指南

将现有 React 网站逐屏迁移为可发布的 Expo 原生应用。

FollowSkills 评估 · FSRS-2.0
不推荐
52/ 100 五分制 2.6 / 5
信任安全14 / 25 · 2.8/5

技能明确迁移范围、后端边界和相对路径限制,未发现恶意代码、凭据窃取或隐蔽外传;但要求安装全局 npm 工具、调用浏览器/模拟器及可能的 EAS 服务,并鼓励目标循环无人值守,缺少逐步确认、权限最小化、数据流说明、回滚方案和失败后的安全恢复,因此扣除11分。

可靠稳定9 / 20 · 2.3/5

步骤顺序、引用文件和验证流程基本一致,涵盖 DOM 外壳、原生化、数据层与发布;但仅有文档,没有提交测试或可复现执行证据,依赖 agent-browser、argent、Expo SDK 及其他技能,异常输入、工具缺失和安装失败的诊断反馈较薄,因此扣除11分,并受静态上限限制。

适用触发10 / 15 · 3.3/5

明确面向已有 Next.js、Vite 或 CRA React 应用,并说明不适用于全新原生项目;触发条件和非适用范围较清楚,但未提供中文交互支持,工具链和部分服务的中国大陆可达性未说明,且对不同项目、平台和后端约束的边界证据有限,因此扣除5分。

规范维护9 / 15 · 3.0/5

SKILL.md 采用渐进式结构,提供 false-friends、native-patterns、设备验证和目标循环等引用;有名称、1.0.0 版本和 MIT 许可,仓库还提供版本检查 CI,但技能未明确维护负责人、更新路径、变更记录、依赖版本或系统化 FAQ,因此扣除6分。

有效结果6 / 15 · 2.0/5

该技能提供从评估、DOM 壳到逐屏原生化和验证的可操作主线,映射表可直接辅助迁移决策;但核心结果依赖多个外部技能、项目实际配置、运行中的双端应用和未提供的后端/认证环境,静态材料无法证明最终产物可直接使用,因此扣除9分,并受静态上限限制。

证据核验4 / 10 · 2.0/5

证据主要是版本固定的技能文档、引用文件和仓库 CI 维护检查,能审计主要主张;但没有覆盖关键路径的测试、真实执行记录或多来源独立复核,外部 Expo 文章仅作为链接引用,因此扣除6分,并受静态上限限制。

证据充分度: 评估于 2026年7月20日 审查版本 8bd359f8a44d
使用前请注意
  • 仅基于源文件静态审查,未执行迁移、安装工具或验证 iOS/Android 行为。
  • 全局安装 agent-browser 和 argent、使用模拟器及目标循环可能产生外部状态变化;应由用户确认权限、网络、认证和回滚策略。
  • 文档未说明中文支持或中国大陆网络可达性,且大量依赖其他 Expo 技能和项目环境。
  • 关于 SDK 56、@expo/ui、DOM 组件及商店支付政策的时效性和适用性未在本材料中独立验证。
查看完整评分方法 →

这个 Skill 能做什么,适合哪些场景?

这是 Expo 官方技能集合中的一个开源技能,专门指导将 Next.js、Vite 或 CRA React 应用迁移到 iOS 和 Android。它采用渐进式迁移:先搭建 Expo 原生壳并通过 DOM 组件运行完整 Web 界面,再按业务价值逐屏改造成原生界面。指南覆盖路由映射、后端边界、数据与认证迁移、原生重设计以及设备运行验证。它适合已有 Web React 应用的团队,不适合仅从零构建原生应用的场景。

读取现有 Web 项目的路由、页面、服务端路由、数据获取方式、认证、样式和第三方 SDK,生成并维护 migration-progress.md 工作清单;使用 create-expo-app 搭建 Expo 壳,并将 Web 路由映射到 Expo Router;指导使用 DOM 组件先运行完整 Web UI,再使用 @expo/ui、Expo Router 和 React Native 原语逐屏原生化;指导使用 expo-data-fetching、EAS Hosting 和 eas-app-stores 处理数据、托管与发布;要求使用 agent-browser 检查 Web 原版,并使用 argent 驱动原生模拟器,对比内容和行为。

  1. 已有 Next.js 应用、希望先发布移动端版本再逐步原生化的团队。
  2. 维护 Vite 或 CRA React 项目、需要将页面按优先级迁移到 iOS 和 Android 的开发者。
  3. 希望保留低价值页面为 DOM 界面、只将高频或依赖手势和键盘的页面改为原生界面的产品团队。
  4. 需要评估服务端路由、Cookie 会话、localStorage、环境变量或浏览器 SDK 如何迁移到移动端的工程师。

这个 Skill 有哪些优点和局限?

优点
  • 提供从评估到商店发布的完整迁移顺序,而不是只讲单个 API。
  • 明确区分页面与后端,并支持逐屏、持续可发布的迁移方式。
  • 包含 Web 与原生在路由、DOM、CSS、数据、认证、存储和第三方 SDK 方面的迁移提示。
  • 强调运行时验证,并指定 agent-browser 与 argent 的对比流程。
局限
  • 依赖已有 Web React 项目;从零构建原生应用时,指南建议直接使用 expo-router。
  • 每个 DOM 页面约携带 2 MB Web 运行时,完整保留为 DOM 可能增加体积。
  • 若 agent-browser 或 argent 未安装,指南要求先安装,安装步骤本身未在该 SKILL.md 中展开。
  • 源码未记录测试套件、支持平台矩阵或实际迁移成功案例。

如何安装这个 Skill?

安装整个 Expo Skills 集合:运行 npx skills@latest add expo/skills --skill '*',然后按提示选择安装位置并重启或刷新 Agent 会话。Codex 用户也可以运行 codex plugin add expo@openai-curated 安装官方插件。源码没有提供单独安装 expo-web-to-native 技能的完整独立命令。

如何使用这个 Skill?

在已安装技能的 Agent 中提出例如:把这个现有的 Next.js React 应用逐步迁移为 Expo iOS/Android 应用,先评估路由并生成 migration-progress.md,再搭建 DOM 组件壳。 按指南先完成评估、搭壳和 DOM 组件阶段,然后逐屏原生化并在 Web 原版与原生模拟器之间验证内容和行为。

这个 Skill 与同类方案有什么区别?

相较于一次性重写,该技能明确采用渐进式迁移:先让整个 Web UI 在原生壳中运行,再按价值逐屏原生化。相较于仅使用 DOM 组件,它还要求将高价值页面重新设计为符合 iOS/Android 习惯的原生界面。

常见问题

这是把网站自动转换成原生应用吗?
不是。指南明确指出没有转换器,流程是搭建原生壳、先运行 Web UI,再逐屏迁移。
可以只迁移部分页面吗?
可以。页面可分类为原样保留、立即原生化、稍后原生化或混合方案,低价值页面可以继续使用 DOM。
使用这个技能是否需要 Expo 的付费服务?
技能本身标注 MIT。文档将 eas-app-stores、EAS Hosting 等列为服务类技能,并说明商店构建等步骤可能涉及 EAS;本技能没有给出具体价格。

同仓库的其他 Skills

均来自 expo/skills

开发与工程

Expo 原生 UI 构建助手

用 @expo/ui 在 Expo 中构建跨平台原生界面。

开发与工程

Expo 棕地集成助手

帮助团队将 Expo 和 React Native 增量集成到现有的原生 iOS 或 Android 应用中。

开发与工程

Expo DOM 组件助手

让 Expo 原生应用渐进式复用 Web 代码与 Web 专属库。

开发与工程

Expo 项目结构指南

为全新的 Expo Router 应用建立清晰、可扩展的文件结构。

开发与工程

Expo 开发客户端构建助手

为 Expo 原生代码测试构建并分发开发客户端。

开发与工程

Expo 应用商店发布助手

用 EAS 构建并发布 Expo 应用到 App Store、Google Play 和 TestFlight。

开发与工程

Expo 技能评测器

端到端验证 Expo 技能是否触发、产出可用代码并正确渲染。

自动化与运维

EAS Observe 性能观测助手

帮助 Expo 团队接入、查询并解读生产环境中的启动、导航和自定义事件性能指标。

开发与工程

Expo 数据请求指南

为 Expo 应用提供从 API 请求到缓存、离线与身份验证的网络开发指导。

开发与工程

Expo 技能反馈

帮助用户提交 Expo 技能或框架反馈,并管理匿名使用遥测。

开发与工程

Expo 集成示例助手

用 Expo 官方示例快速适配第三方库与服务。

设计与前端

Expo 原生界面设计指南

帮助 Expo 开发者构建符合 Apple 设计规范、具备原生体验的响应式界面。

开发与工程

Expo SDK 升级助手

帮助 Expo 团队升级 SDK、处理依赖冲突并完成兼容性清理。

开发与工程

Expo EAS 托管部署

帮助 Expo 项目部署网站与 API 路由,并配置密钥、域名和边缘运行时。

开发与工程

Expo Tailwind 样式配置助手

为 Expo 应用配置 Tailwind CSS v4、NativeWind v5 与跨平台样式支持。

开发与工程

Expo 原生模块迁移助手

将现有 Expo 原生模块从 1.0 DSL 迁移到 2.0 宏 API,同时保持 JavaScript 接口不变。

开发与工程

Expo Router 导航助手

为 Expo 应用设计文件路由与原生导航结构。

开发与工程

EAS 云端模拟器助手

让无法本地运行模拟器的团队在 EAS 云端运行、操控并截图 Expo 应用。

开发与工程

Expo App Clip 助手

为 Expo 应用配置可由网址唤起的 iOS App Clip。

自动化与运维

EAS 更新健康洞察

用 CLI 检查 EAS Update 的崩溃率、采用情况与发布健康度。

相关 Skills