SuperAPI AI 工具集

react-native-expo

编程与开发

查看项目

更新于 10-14 06:02

技能介绍

用途

该技能用于构建与维护 React Native 0.76–0.82+、Expo SDK 52–54 的应用,帮助开发者在升级与迁移过程中规避破坏性变更。资料标注状态为 Production Ready,最后更新 2026-01-21。

依赖与版本

依赖 Node.js 20.19.4+、Expo CLI,iOS 需 Xcode 16.1+。资料给出的最新版本为 react-native@0.81.5、expo@~54.0.31、react@19.2.3。

快速开始

  1. 创建新 Expo 项目(RN 0.76+):
npx create-expo-app@latest my-app
cd my-app
npx expo install react-native@latest expo@latest

资料说明 Expo SDK 52+ 默认启用新架构,React Native 0.82+ 强制使用新架构且无法关闭,Hermes 是唯一受支持的 JavaScript 引擎(Expo Go 已移除 JSC)。

  1. 验证新架构是否启用:
npx expo config --type introspect | grep newArchEnabled

资料提示:从 0.75 或更早版本迁移时应先升级到 0.76–0.81 以使用互操作层;0.82+ 不要尝试关闭新架构,否则构建会失败。

  1. 启动开发服务器:
npx expo start
# 按 'i' 启动 iOS 模拟器,'a' 启动 Android 模拟器,'j' 打开 React Native DevTools

资料提示旧版 Chrome 调试器在 0.79 被移除,应改用 React Native DevTools;Metro 终端不再输出 console.log();快捷键 'a'/'i' 在 CLI 中生效。

关键破坏性变更

新架构强制启用(0.82+)

SDK 时间线:Expo SDK 54(RN 0.81)是最后一个支持旧架构的版本;Expo SDK 55(RN 0.83)强制新架构,旧架构被完全移除。0.76–0.81/SDK 52–54 新架构为默认,旧架构被冻结;0.82+/SDK 55+ 旧架构已从代码库删除。newArchEnabled=false 或 RCT_NEW_ARCH_ENABLED=0 会被忽略并导致构建失败。迁移路径:先升级到 0.76–0.81/SDK 54,开启新架构测试,修复不兼容依赖(Redux、i18n、CodePush、Reanimated v3 → v4),再升级到 0.82+/SDK 55+。

propTypes 被移除(React 19 / RN 0.78+)

React 19 完全移除 propTypes,静默忽略且无警告。应改用 TypeScript 类型,并可用 npx @codemod/react-19 upgrade 移除。

forwardRef 弃用(React 19)

ref 可作为普通 prop 传递,不再需要 forwardRef 包装。

Swift iOS 模板(0.77+)

新项目使用 Swift 的 AppDelegate.swift 替代 Objective-C。迁移时必须添加:

import React
import ReactCoreModules
RCTAppDependencyProvider.sharedInstance()

Metro 日志转发移除(0.77+)

console.log() 不再出现在 Metro 终端,可用临时参数 --client-logs(已弃用),推荐使用 React Native DevTools 控制台。

Chrome 调试器移除(0.79+)

旧 Chrome 调试器(chrome://inspect)已移除,改用 React Native DevTools(按 'j' 或 Dev Menu 打开),其基于 Chrome DevTools Protocol,支持可靠断点、监听值与调用栈检查、JS 控制台;暂不支持第三方扩展,网络检查器计划在 0.83 推出。

JSC 移至社区(0.79+)

JavaScriptCore 一等支持从 React Native 0.81+ 核心移除。仍需 JSC 时可安装 @react-native-community/javascriptcore;Expo Go 自 SDK 52+ 完全移除 JSC,仅支持 Hermes。

深层导入弃用(0.80+)

禁止从内部路径导入,只能从 'react-native' 导入,如 import { Button, Platform } from 'react-native'。

Android 边到边强制(SDK 54+)

所有 Android 应用默认启用边到边且无法关闭,edgeToEdgeEnabled: false 无效。内容会延伸到状态栏和导航栏下方,需使用 react-native-safe-area-context 的 SafeAreaView 手动处理 insets。

新功能

CSS 属性(0.77+,仅新架构)

包括 display: contents、boxSizing(border-box / content-box)、mixBlendMode(16 种模式,如 multiply、screen、overlay 等)与 isolation,以及不影响布局的 outline 属性(outlineWidth、outlineStyle、outlineColor、outlineOffset、outlineSpread)。

Android XML Drawables(0.78+)

可将原生 Android 矢量 XML 作为 Image 源使用,仅限构建时资源、仅 Android;优势包括分辨率无关、APK 更小、离线程解码。

React 19 新 Hooks

  • useActionState:替代表单模式,支持异步提交与 isPending 状态。
  • useOptimistic:乐观 UI 更新,先更新界面再同步服务器。
  • use:在渲染期间直接读取 promise 或 context。

已知问题预防

资料称该技能可预防 16 个已记录问题,包括:propTypes 静默忽略、forwardRef 弃用警告、0.82+ 无法关闭新架构、"Fabric component descriptor not found"、"TurboModule not registered"、Swift AppDelegate 缺少 RCTAppDependencyProvider、Metro 日志不显示、Chrome 调试器失效、深层导入报错、Redux Store 崩溃(应改用 Redux Toolkit)、i18n-js 不可靠(应改用 react-i18next)、CodePush 在 Android 崩溃、expo-file-system 旧 API 在 SDK 55+ 移除(需迁移到 File/Directory 类 API)、expo-av 在 SDK 55+ 移除(需迁移到 expo-audio 与 expo-video)。

适用场景与限制

适用于使用 Expo 构建 React Native 跨平台应用、以及从旧版本升级到新架构和 React 19 的团队。限制包括:新架构在 0.82+/SDK 55+ 不可关闭;JSC 需另装社区包;Android XML drawables 仅限 Android 且为构建时资源;DevTools 暂不支持第三方扩展;具体定价、价格等信息资料暂未提供。