在现有 React Native 项目中安装 Expo 模块

了解如何准备你的现有 React Native 项目，以安装和使用任何 Expo 模块。

For the complete documentation index, see llms.txt. Use this Use this file to discover all available pages.

要在你的应用中使用 Expo 模块，你需要安装并配置 expo 包。

expo 包体积很小；它只包含几乎每个应用都需要的一小组基础包，以及其他 Expo SDK 包所依赖的模块和自动链接基础设施。只要 expo 包已在你的项目中安装并配置好，你就可以使用 npx expo install 来添加 SDK 中的任何其他 Expo 模块。

根据你初始化项目的方式不同，你可以通过两种方式安装 Expo 模块：自动或手动。

自动安装

要安装并使用 Expo 模块，最简单的上手方式是使用 install-expo-modules 命令。

• 当命令成功执行时，你就可以在应用中添加任意 Expo 模块了！更多信息请继续查看用法。

• 如果命令失败，请按照手动安装说明进行操作。以编程方式更新代码可能比较棘手，如果你的项目与默认的 React Native 项目有较大差异，那么你需要执行手动安装，并将此处的说明适配到你的代码库中。

手动安装

以下说明适用于在 React Native 0.83 中安装最新版 Expo 模块。对于更早的版本，请查看native upgrade helper以了解这些文件是如何定制的。

安装完成后，请根据下面的差异内容对项目进行相应修改，以在你的项目中配置 Expo 模块。这预计需要大约五分钟，并且根据你的项目定制程度，可能需要稍作调整。

Android 配置

iOS 配置

你也可以选择在 AppDelegate.swift 中添加额外的 delegate 方法。有些库可能需要它们，因此除非你有充分理由不添加，否则建议添加。查看 AppDelegate.swift 中的 delegate 方法。

保存所有更改，并在 Xcode 中将 iOS Deployment Target 更新为 iOS 15.1：

• 在 Xcode 中打开 your-project-name.xcworkspace，在左侧边栏中选择你的项目。
• 选择 Targets > your-project-name > Build Settings > iOS Deployment Target，并将其设置为 iOS 15.1。

最后一步是重新安装项目的 CocoaPods，以引入我们在 Podfile 中添加的 use_expo_modules! 指令所检测到的 Expo 模块：

配置 Expo CLI 以在 Android 和 iOS 上进行打包

我们建议使用 Expo CLI 及相关工具配置来打包应用的 JavaScript 代码和资源文件。这样会增加对在 package.json 中使用 "main" 字段并使用 Expo Router 库的支持。未使用 Expo CLI 进行打包可能会导致意外行为。了解更多关于 Expo CLI 的信息。

if [[ -f "$PODS_ROOT/../.xcode.env" ]]; then
  source "$PODS_ROOT/../.xcode.env"
fi
if [[ -f "$PODS_ROOT/../.xcode.env.local" ]]; then
  source "$PODS_ROOT/../.xcode.env.local"
fi

# 默认情况下，项目根目录比 ios 目录上一级
export PROJECT_ROOT="$PROJECT_DIR"/..

if [[ "$CONFIGURATION" = *Debug* ]]; then
  export SKIP_BUNDLING=1
fi
if [[ -z "$ENTRY_FILE" ]]; then
  # 使用打包器的入口解析来设置入口 JS 文件。
  export ENTRY_FILE="$("$NODE_BINARY" -e "require('expo/scripts/resolveAppEntry')" "$PROJECT_ROOT" ios relative | tail -n 1)"
fi

if [[ -z "$CLI_PATH" ]]; then
  # 使用 Expo CLI
  export CLI_PATH="$("$NODE_BINARY" --print "require.resolve('@expo/cli')")"
fi
if [[ -z "$BUNDLE_COMMAND" ]]; then
  # Expo CLI 默认的打包命令
  export BUNDLE_COMMAND="export:embed"
fi

`"$NODE_BINARY" --print "require('path').dirname(require.resolve('react-native/package.json')) + '/scripts/react-native-xcode.sh'"`

用法

验证安装

你可以通过从 expo-constants 记录一个值来验证安装是否成功。

• 运行 npx expo install expo-constants
• 然后，运行 npx expo run 并修改你的应用 JavaScript 代码，添加以下内容：

import Constants from 'expo-constants';
console.log(Constants.systemFonts);

使用 Expo SDK 包

一旦 expo 包已在你的项目中安装并配置好，你就可以使用 npx expo install 来添加 SDK 中的任何其他 Expo 模块。更多信息请参阅使用库。

expo 包中包含的 Expo 模块

以下 Expo 模块作为 expo 包的依赖被引入：

• expo-asset - 一个仅包含 JavaScript 的包，围绕 expo-file-system 构建，并为所有 Expo 模块中的资源提供通用基础。
• expo-constants - 提供对 manifest 的访问。
• expo-file-system - 与设备文件系统交互。被 expo-asset 和许多其他 Expo 模块使用。开发者通常也会在应用代码中直接使用它。
• expo-font - 在运行时加载字体。该模块是可选的，并且可以安全移除；不过，如果你在开发中使用 expo-dev-client，则建议保留它，并且 @expo/vector-icons 也需要它。
• expo-keep-awake - 在开发你的应用时防止设备进入睡眠状态。该模块是可选的，并且可以安全移除。

要排除这些模块中的任何一个，请参阅以下关于从自动链接中排除模块的指南。

从自动链接中排除特定模块

如果你需要排除你没有使用、但由其他依赖安装进来的 Expo 模块中的原生代码，你可以在 package.json 中使用 expo.autolinking.exclude 属性：

{
  "name": "...",
  "dependencies": {},
  "expo": {
    "autolinking": {
      "exclude": ["expo-keep-awake"]
    }
  }
}