Expo CLI
Expo CLI 是一个命令行工具,是开发者和其他 Expo 工具之间的主要界面。
expo 包提供了一个小巧且强大的命令行工具 npx expo,旨在帮助你在应用开发过程中保持快速的工作节奏。
🌐 The expo package provides a small and powerful CLI tool npx expo which is designed to keep you moving fast during app development.
高亮
🌐 Highlights
- 启动一个服务器来开发你的应用:
npx expo start。 - 为你的项目
npx expo prebuild生成本地 Android 和 iOS 目录:生成本地 Android 和 iOS 目录。 - 在本地构建并运行原生应用:
npx expo run:ios和npx expo run:android。 - 安装和更新与项目中
react-native版本兼容的包:npx expo install package-name。 npx expo可以与npx react-native同时使用。
要查看 Expo CLI 中的可用命令列表,请在项目中运行以下命令:
🌐 To view a list of available commands in Expo CLI, run the following in your project:
- npx expo -h如果你更喜欢使用 yarn 作为包管理器,也可以运行
yarn expo -h。
输出应如下所示:
🌐 The output should look something like below:
Usage $ npx expo <command> Commands start, export run:ios, run:android, prebuild install, customize, config login, logout, whoami, register Options --version, -v Version number --help, -h Usage info
你可以使用 --help 或 -h 标志运行任何命令以了解更多信息:
🌐 You can run any command with the --help or -h flag to learn more about it:
- npx expo login -h安装
🌐 Installation
Expo CLI 包含在 expo 包中。你可以使用 npm 或 yarn 安装它:
🌐 Expo CLI is included in the expo package. You can install it with npm or yarn:
- yarn add expo没有使用 Expo 预构建 的项目(也称为 Bare 项目)需要进行额外的设置,以确保所有自定义的 Expo 打包功能能够正常工作:Metro:Bare 工作流设置。
开发
🌐 Develop
通过运行以下命令启动开发服务器来处理你的项目:
🌐 Start a development server to work on your project by running:
- npx expo start你也可以将
npx expo作为npx expo start的别名来运行。
此命令将在 http://localhost:8081 上启动一个服务器,客户端可以使用它与打包器进行交互。默认的打包器是 Metro。
🌐 This command starts a server on http://localhost:8081 that a client can use to interact with the bundler. The default bundler is Metro.
在该过程中显示的界面被称为终端界面。它包含一个二维码(用于开发服务器的 URL)以及一列你可以按的快捷键:
🌐 The UI that shows up in the process is referred to as the Terminal UI. It contains a QR code (for the dev server URL) and a list of keyboard shortcuts you can press:
| Keyboard shortcut | Description |
|---|---|
| A | Open the project on a connected Android device. |
| Shift + A | Select an Android device or emulator to open. |
| I | Open the project in an iOS Simulator. |
| Shift + I | Select an iOS Simulator to open. |
| W | Open the project in a web browser. This may require webpack to be installed in your project. |
| R | Reload the app on any connected device. |
| S | Switch the launch target between Expo Go and development builds. |
| M | Open the dev menu on any connected native device (web not supported). |
| Shift + M | Choose more commands to trigger on connected devices. This includes toggling the performance monitor, opening the element inspector, reloading the device, and opening the dev menu. |
| J | Open React Native DevTools for any connected device that is using Hermes as the JavaScript engine. Learn more. |
| O | Open project code in your editor. This can be configured with the EXPO_EDITOR and EDITOR environment variables. |
| E | Show the development server URL as a QR code in the terminal. |
| ? | Show all Terminal UI commands. |
触发目标
🌐 Launch target
npx expo start 命令会在项目中安装了 expo-dev-client 的情况下自动以开发构建模式启动应用。否则,它会在 Expo Go 中启动应用。
🌐 The npx expo start command automatically launches the app in a development build if expo-dev-client is installed in the project. Otherwise, it launches the app in Expo Go.
或者,你可以通过将以下标志传递给命令来强制启动目标:
🌐 Alternatively, you can force the launch target by passing the following flags to the command:
--dev-client:始终在开发版本中启动应用。--go:始终在 Expo Go 中启动该应用。
你也可以在运行时通过在 终端界面 中按 S 来切换启动目标。run 命令在编译开发版本后默认也会使用 --dev-client。
服务器地址
🌐 Server URL
默认情况下,项目通过局域网连接提供服务。你可以使用标志 npx expo start --localhost 将此行为更改为仅本地主机。
🌐 By default, the project is served over a LAN connection. You can change this behavior to localhost-only by using the flag npx expo start --localhost.
其他可用选项有:
🌐 Other available options are:
--port:用于启动开发服务器的端口(不适用于 webpack 或 隧道 URL)。使用--port 0可自动使用第一个可用端口。默认值:8081。--https:(已弃用,建议使用--tunnel) 使用安全源启动开发服务器。目前仅在 Web 上受支持。
你可以使用 EXPO_PACKAGER_PROXY_URL 环境变量强制将 URL 设置为任意值。例如:
🌐 You can force the URL to be any value with the EXPO_PACKAGER_PROXY_URL environment variable. For example:
- export EXPO_PACKAGER_PROXY_URL=http://expo.dev- npx expo start将打开应用到:exp://expo.dev:80(:80 是 Android WebSockets 的临时解决方法)。
🌐 Will open apps to: exp://expo.dev:80 (the :80 is a temporary workaround for Android WebSockets).
通道技术
🌐 Tunneling
限制性网络条件(公共 Wi-Fi 中常见)、防火墙(Windows 用户中常见)或模拟器配置错误可能会导致难以通过 lan/localhost 将远程设备连接到开发服务器。
🌐 Restrictive network conditions (common for public Wi-Fi), firewalls (common for Windows users), or Emulator misconfiguration can make it difficult to connect a remote device to your dev server over lan/localhost.
有时通过任何可以上网的设备访问的代理 URL 连接到开发服务器会更容易,这被称为隧道连接。npx expo start 提供了通过 ngrok 进行隧道连接的内置支持。
🌐 Sometimes it's easier to connect to a dev server over a proxy URL that's accessible from any device with internet access, this is referred to as tunneling. npx expo start provides built-in support for tunneling via ngrok.
要启用隧道,首先安装 @expo/ngrok:
🌐 To enable tunneling, first install @expo/ngrok:
- npm i -g @expo/ngrok然后运行以下命令,从一个 tunnel URL 启动你的开发服务器:
🌐 Then run the following to start your dev server from a tunnel URL:
- npx expo start --tunnel这将通过类似 https://xxxxxxx.bacon.19000.exp.direct:80 的公共 URL 提供你的应用。
🌐 This will serve your app from a public URL like: https://xxxxxxx.bacon.19000.exp.direct:80.
使用 EXPO_TUNNEL_SUBDOMAIN 环境变量可以实验性地设置隧道 URL 的子域。这对于测试 iOS 上的通用链接很有用。这可能会导致 expo-linking 和 Expo Go 出现意外问题。通过传递一个不是以下之一的 string 值来选择要使用的确切子域:true、false、1、0。
🌐 Use the EXPO_TUNNEL_SUBDOMAIN environment variable to experimentally set the subdomain for the tunnel URL. This is useful for testing universal links on iOS. This may cause unexpected issues with expo-linking and Expo Go. Select the exact subdomain to use by passing a string value that is not one of: true, false, 1, 0.
缺点
- 隧道连接比本地连接慢,因为请求必须转发到公共 URL。
- 隧道 URL 是公开的,任何有网络连接的设备都可以访问。Expo CLI 通过在 URL 开头添加随机性来减少暴露风险。通过清除项目中的 .expo 目录可以重置随机性。
- 隧道需要两台设备都有网络连接,这意味着此功能无法与
--offline标志一起使用。
隧道传输需要第三方托管服务,这意味着有时可能会遇到像 ngrok tunnel took too long to connect 或 Tunnel connection has been closed. This is often related to intermittent connection problems with the Ngrok servers... 这样的间歇性问题。在报告问题之前,请务必检查 Ngrok 停机情况。一些 Windows 用户也报告说,需要修改他们的杀毒软件设置以让 Ngrok 正常工作。
🌐 Tunneling requires a third-party hosting service, this means it may sometimes experience intermittent issues like ngrok tunnel took too long to connect or Tunnel connection has been closed. This is often related to intermittent connection problems with the Ngrok servers.... Be sure to check for Ngrok outages before reporting an issue. Some Windows users have also reported needing to modify their antivirus settings to allow Ngrok to work correctly.
离线
🌐 Offline
你可以使用 --offline 标志在没有网络连接的情况下进行开发:
🌐 You can develop without a network connection by using the --offline flag:
- npx expo start --offline离线模式将阻止 CLI 发起网络请求。如果你不使用该标志且电脑没有网络连接,那么离线支持将会自动启用,只是验证可达性会花费更长时间。
🌐 Offline will prevent the CLI from making network requests. If you don't use the flag and your computer has no internet connection, then offline support will automatically be enabled, it will just take a bit longer to verify the reachability.
Expo CLI 发出网络请求,以使用你的用户凭据签署清单,以确保敏感信息在可重用运行时(如 Expo Go)中沙箱化。
🌐 Expo CLI makes network requests to sign manifests with your user credentials to ensure sensitive information is sandboxed in reusable runtimes like Expo Go.
.expo 目录
🌐 .expo directory
当你第一次在一个项目中启动开发服务器时,会在该项目的根目录下创建一个 .expo 目录。它包含两个文件:
🌐 When you start the development server in a project for the first time, a .expo directory is created at the root of that project. It contains two files:
- devices.json:包含最近打开过此项目的设备信息。
- settings.json:包含用于提供项目清单的服务器配置信息。
这两个文件都包含特定于你本地计算机的信息。这就是为什么在创建新项目时,默认情况下 .expo 目录会被包含在 .gitignore 文件中的原因。它不打算与其他开发者共享。
🌐 Both of these files have information that is specific to your local computer. This is the reason why .expo directory is included in the .gitignore file, by default, when a new project is created. It is not meant to be shared with other developers.
架构
🌐 Building
一个 React Native 应用由两部分组成:本地运行时(编译)和静态文件,如 JavaScript 包和资源文件(导出)。Expo CLI 提供了执行这两项任务的命令。
🌐 A React Native app consists of two parts: a native runtime (compiling), and static files like JavaScript bundles and assets (exporting). Expo CLI provides commands for performing both tasks.
编译
🌐 Compiling
你可以使用 run 命令在本地编译你的应用:
🌐 You can compile your app locally with the run commands:
# Build for iOS- npx expo run:ios# Build for Android- npx expo run:android亮点
- 使用
--device标志可以直接在已连接的设备上构建,而不会产生全局副作用。支持锁定的设备,让你可以立即重试,而无需重新构建。 - 自动协同设计 iOS 应用,以便从 CLI 进行开发,无需打开 Xcode。
- 智能日志解析显示项目源代码中的警告和错误,这与 Xcode 不同,Xcode 会显示来自节点模块的数百个良性警告。
- 导致应用崩溃的致命错误将在终端中显示,从而无需在 Xcode 中重现。
npx expo run:ios 只能在 Mac 上运行,并且必须安装 Xcode。你可以使用 eas build -p ios 在云端从任何电脑构建应用。同样,npx expo run:android 需要在电脑上安装并配置 Android Studio 和 Java。
在本地构建对于开发原生模块和调试复杂的原生问题非常有用。使用 eas build 进行远程构建则是一个更可靠的选择,因为它有预配置的云环境。
🌐 Building locally is useful for developing native modules and debugging complex native issues. Building remotely with eas build is a much more resilient option due to the pre-configured cloud environment.
如果你的项目没有相应的原生目录,npx expo prebuild 命令将在构建之前运行一次以生成相应的目录。
🌐 If your project does not have the corresponding native directories, the npx expo prebuild command will run once to generate the respective directory before building.
例如,如果你的项目在根目录下没有 ios 目录,那么 npx expo run:ios 将在编译你的应用之前先运行 npx expo prebuild -p ios。有关此过程的更多信息,请参见 Expo 预构建。
🌐 For example, if your project does not have an ios directory in the root of your project, then npx expo run:ios will first run npx expo prebuild -p ios before compiling your app. For more information on this process, see Expo Prebuild.
跨平台参数
--no-build-cache:在构建之前清除本地缓存。在 iOS 上,这是 派生数据 目录。清除缓存对于分析构建时间非常有用。--no-install:跳过安装依赖。在 iOS 上,如果项目的package.json中的dependencies字段已更改,这也将跳过运行npx pod-install。--no-bundler:跳过启动开发服务器。如果开发服务器已经从其他进程提供应用服务,则会自动启用。-d, --device [device]:要在其上构建应用的设备名称或ID。你可以在不带参数的情况下传入--device来从可用选项列表中选择设备。这既支持连接的设备,也支持虚拟设备。-p, --port <port>:启动开发服务器的端口。默认值:8081。这仅与开发版本相关。生产版本将在安装到设备之前,导出 项目并将文件嵌入本地二进制文件中。--binary <path>:要在设备上安装的二进制文件的文件路径。提供此路径时,构建过程将被跳过,并尝试直接安装该二进制文件。如果二进制文件不是为正确的设备构建的,例如,它是为模拟器构建的或已安装到设备上,那么该命令将会失败。
编译 Android
🌐 Compiling Android
Android 应用可以有多个不同的变体,这些变体在项目的 build.gradle 文件中定义。可以使用 --variant 标志选择变体:
🌐 Android apps can have multiple different variants which are defined in the project's build.gradle file. Variants can be selected with the --variant flag:
debug 变体
🌐 debug variant
对于调试构建,请使用 debug 变体:
🌐 Use the debug variant for a debug build:
- npx expo run:android --variant debugdebugOptimized 变体
🌐 debugOptimized variant
重要
debugOptimized在 SDK 54 及更高版本中可用。
使用 debugOptimized 版本可以在保持整体构建对调试友好的模式下,实现接近发布版本的性能,从而加快开发速度:
🌐 Use the debugOptimized variant for faster development with performance close to release builds while keeping the overall build in a debug-friendly mode:
- npx expo run:android --variant debugOptimized使用此变体时,请注意以下事项:
🌐 When using this variant, keep the following in mind:
- 像发布版本一样优化 C++ 库,提高运行时性能
- 在 EAS Build 中,使用与
:app:assembleDebugOptimized在 eas.json 中 相匹配的 Gradle 命令 - 限制:C++ 调试已被禁用,C++ 崩溃可能会有较难阅读的堆栈跟踪
release 变体
🌐 release variant
你可以通过运行以下命令来编译 Android 应用以用于生产:
🌐 You can compile the Android app for production by running:
- npx expo run:android --variant release此构建不会自动进行代码签名以提交到 Google Play 商店。此命令应仅用于测试可能仅在生产构建中出现的错误。要生成用于 Play 商店且已进行代码签名的生产构建,我们推荐使用 EAS Build。
🌐 This build is not automatically code-signed for submission to the Google Play Store. This command should be used to test bugs that may only show up in production builds. To generate a production build that is code signed for the Play Store, we recommend using EAS Build.
调试原生 Android 项目
🌐 Debugging native Android project
你可以通过在 Android Studio 中打开 android 目录,使用本地调试工具调试原生 Android 项目:
🌐 You can debug the native Android project using native debugging tools by opening the android directory in Android Studio:
- open -a /Applications/Android Studio.app android如果你有一个使用不同产品风味的定制 Android 项目,你可以使用 --variant 和 --app-id 标志来配置风味和应用 ID:
🌐 If you have a customized Android project using different product flavors, you can configure both the flavor and application ID using the --variant and --app-id flags:
- npx expo run:android --variant freeDebug --app-id dev.expo.myapp.free欲了解更多信息,请参阅《使用 Android 产品风格的本地构建》指南(/guides/local-app-development/#local-builds-using-android-product-flavors)。
🌐 For more information, see the Local builds using Android product flavors guide.
编译 iOS
🌐 Compiling iOS
一个 iOS 应用可以有多个 方案 来表示不同的子应用,如 App Clips、watchOS 应用、Safari 扩展等。默认情况下,npx expo run:ios 会选择你的 iOS 应用的方案。你可以通过 --scheme <my-scheme> 参数选择自定义方案。如果你单独传入 --scheme 参数,Expo CLI 会提示你从 Xcode 项目中可用方案列表中选择一个方案。
🌐 An iOS app can have multiple schemes for representing different sub-apps like App Clips, watchOS apps, Safari Extensions, and so on. By default, npx expo run:ios will choose the scheme for your iOS app. You can pick a custom scheme with the --scheme <my-scheme> argument. If you pass in the --scheme argument alone, then Expo CLI will prompt you to choose a scheme from the list of available options in your Xcode project.
你选择的方案将过滤出在选择提示中显示的 --device 选项,例如,选择 Apple TV 方案将只显示可用的 Apple TV 设备。
🌐 The scheme you select will filter out which --device options show up in the selection prompt, for example, selecting an Apple TV scheme will only show available Apple TV devices.
你可以通过运行以下命令来编译用于生产的 iOS 应用:
🌐 You can compile an iOS app for production by running:
- npx expo run:ios --configuration Release此构建不会自动进行用于提交到 Apple App Store 的代码签名。npx expo run:ios 主要用于测试仅在生产构建中才会出现的错误。原生代码签名需要进行多个网络请求,并且容易受到 Apple 服务器各种错误的影响。要生成用于 App Store 的签名生产构建,我们推荐使用 EAS Build。
🌐 This build is not automatically code signed for submission to the Apple App Store. npx expo run:ios should mostly be used to test bugs that only show up in production builds. Native code signing requires several network requests and is prone to many different types of errors from the Apple servers. To generate a production build that is code signed for the App Store, we recommend using EAS Build.
当你将应用编译到模拟器上时,模拟器的本地错误日志会被传输到终端中的 Expo CLI 进程。这对于快速查看可能导致致命错误的 bug 非常有用。例如,缺少权限的消息。错误传输在实际的 iOS 设备上不可用。
🌐 When you compile your app onto a Simulator, the Simulator's native error logs will be piped to the Expo CLI process in the terminal. This is useful for quickly seeing bugs that may cause a fatal error. For example, missing permission messages. Error piping is not available for physical iOS devices.
你可以通过在 Xcode 中打开项目并从 Xcode 重新构建来使用 lldb 以及所有原生 Apple 调试工具进行调试:
🌐 You can debug using lldb and all of the native Apple debugging tools by opening the project in Xcode and rebuilding from Xcode:
- xed ios使用 Xcode 构建很有用,因为你可以设置原生断点并分析应用的任何部分。请确保跟踪源代码控制(git)中的更改,以防你需要使用 npx expo prebuild -p ios --clean 重新生成原生应用。
🌐 Building from Xcode is useful because you can set native breakpoints and profile any part of the application. Be sure to track changes in source control (git) in case you need to regenerate the native app with npx expo prebuild -p ios --clean.
iOS 开发签名
如果你想看看你的应用在设备上的运行效果,只需连接设备,运行 npx expo run:ios --device,然后选择你已连接的设备即可。
🌐 If you want to see how your app will run on your device, all you have to do is connect it, run npx expo run:ios --device, and select your connected device.
Expo CLI 将自动对设备进行签名以进行开发、安装应用并启动它。
🌐 Expo CLI will automatically sign the device for development, install the app, and launch it.
如果你的电脑上没有设置任何开发者账户,那么你需要按照此指南在 Expo CLI 之外手动设置它们:设置 Xcode 签名。
🌐 If you don't have any developer profiles setup on your computer then you'll need to set them up manually outside of Expo CLI by following this guide: Setup Xcode signing.
导出
🌐 Exporting
你可以通过运行以下命令使用 Metro 打包程序导出应用的 JavaScript 和资源:
🌐 You can export the JavaScript and assets for your app using Metro bundler by running:
- npx expo export在使用 eas update 或编译本地运行时,这会自动补齐。export 命令的工作方式类似于大多数网络框架:
🌐 This is done automatically when using eas update or when compiling the native runtime. The export command works similar to most web frameworks:
- 打包工具会将你的应用代码进行转译和打包,以适应生产环境,并去除所有由
__DEV__布尔值保护的代码。 - 所有静态文件都被复制到一个静态 dist 目录中,可以从静态主机提供服务。
- public 目录的内容会按原样复制到 dist 目录中。
提供以下选项:
🌐 The following options are provided:
--platform <platform>:选择要编译的平台:'ios'、'android' 或 'all'。默认:all。如果在应用配置中设置了,也可以使用 'web'。更多信息,请参见 自定义 Metro。--dev:适用于开发环境的打包包,不会压缩代码或移除__DEV__布尔值。--output-dir <dir>:导出静态文件的目录。默认值:dist--max-workers <number>:允许打包器生成的最大任务数。将此设置为0将在同一进程中运行所有转译,这意味着你可以轻松调试 Babel 转译。-c, --clear:导出前清除打包器缓存。--no-minify:跳过最小化 JavaScript 和 CSS 资源。--no-bytecode:跳过为本地平台生成 Hermes 字节码。仅将其用于分析包大小,切勿将 UTF-8 包发布到本地平台,因为这会导致启动时间大幅延长。--no-ssg:跳过为网页路由导出静态 HTML 文件。此选项仅在 dist 目录中生成服务器代码。适用于 API 路由。
使用子路径托管
🌐 Hosting with sub-paths
重要 实验功能。
你可以通过在你的 应用配置 中设置 experiments.baseUrl 字段来配置静态资源的前缀:
🌐 You can configure the prefix for static assets by setting the experiments.baseUrl field in your app config:
{ "expo": { "experiments": { "baseUrl": "/my-root" } } }
这将导出网站,并将所有资源的前缀设置为 /my-root。例如,一个位于 assets/image.png 的图片预计会托管在 /my-root/assets/image.png。实际文件将位于与整个目录相同的文件系统位置,因为整个目录预计会在服务器上托管于 /my-root。
🌐 This will export the website with all resources prefixed with /my-root. For example, an image at assets/image.png will be expected to be hosted at /my-root/assets/image.png. The actual file will be located in the same file system location as the entire directory is expected to be hosted at /my-root on the server.
Expo Router 内置支持 baseUrl。在使用 Link 和 router API 时,baseUrl 会自动添加到 URL 前面。
🌐 Expo Router has built-in support for baseUrl. When using the Link and router APIs, the baseUrl will be automatically prepended to the URL.
import { Link } from 'expo-router'; export default function Blog() { return <Link href="/blog/123">Go to blog post</Link>; }
这将导出到以下内容:
🌐 This will export to the following:
<a href="/my-root/blog/123">Go to blog post</a>
如果你直接使用 <a>、React Navigation 或 Linking API,你需要手动在前面添加 baseUrl。
🌐 If you use <a>, React Navigation, or the Linking API directly, you'll need to manually prepend the baseUrl.
baseUrl 功能仅适用于生产环境,必须在导出网站之前设置。如果你更改了该值,必须重新导出网站。
🌐 The baseUrl functionality is production-only and must be set before exporting the website. If you change the value, you must re-export the website.
如果你 require 或 import 它们,图片和其他资源将会自动工作。如果你直接引用资源 URL,则需要手动添加 baseUrl。
🌐 Images and other assets will work automatically if you require or import them. If you directly reference a resource URL then you will need to append the baseUrl manually.
import { Image } from 'expo-image'; export default function Blog() { return <Image source={require('@/assets/image.png')} />; }
这将导出到以下内容:
🌐 This will export to the following:
<img src="/my-root/assets/assets/image.png" />
手动传递 URL 需要手动添加前缀:
🌐 Manually passing a URL will need to be manually prefixed:
export default function Blog() { return <img src="/my-root/assets/image.png" />; }
使用 webpack 导出
🌐 Exporting with webpack
警告 已弃用:从 SDK 50 开始,Expo Webpack 已被弃用,取而代之的是通用 Metro (
npx expo export)。了解更多信息请访问 从 Webpack 迁移到 Expo Router。
你可以通过运行以下命令使用 webpack 导出 Web 应用的 JavaScript 和资源:
🌐 You can export the JavaScript and assets for your web app using webpack by running the following:
- npx expo export:web--dev:在“开发”模式下打包,但不压缩代码或去除__DEV__布尔值。-c, --clear:导出前清除打包器缓存。
如果你的项目配置为通过 expo.web.bundler: 'metro' 字段使用 metro 来打包 app.json 中的 Web 项目,则此命令将被禁用。
🌐 This command will be disabled if your project is configured to use metro for bundling web projects in the app.json via the expo.web.bundler: 'metro' field.
预建
🌐 Prebuild
- npx expo prebuild在本地应用可以编译之前,必须生成本地源代码。Expo CLI 提供了一个独特而强大的系统,称为 prebuild,它会为你的项目生成本地代码。要了解更多信息,请阅读 Expo Prebuild 文档。
🌐 Native source code must be generated before a native app can compile. Expo CLI provides a unique and powerful system called prebuild, that generates the native code for your project. To learn more, read the Expo Prebuild docs.
Lint
- npx expo lintLinting 有助于执行最佳实践并确保你的代码一致。npx expo lint 命令将使用针对 Expo 的特定设置设置 ESLint,并运行带有为 Expo 框架优化选项的 npx eslint 命令。通过运行 npx expo lint --fix,可以自动修复 linting 问题。
🌐 Linting helps enforce best practices and ensure your code is consistent. The npx expo lint command will set up ESLint with Expo-specific settings and run the npx eslint command with options that are optimized for the Expo framework. By running npx expo lint --fix, linting issues can be fixed automatically.
默认情况下,运行 npx expo lint 会针对 src、app 和 components 目录中的所有文件进行操作。你也可以将自定义文件或目录作为参数传递给 lint 命令。例如:
🌐 Running npx expo lint targets all files in the src, app, and components directories by default. You can also pass custom files or directories to the lint command as arguments. For example:
- npx expo lint ./utils constants.ts所有匹配 .js, .jsx, .ts, .tsx, .mjs, .cjs 扩展名的文件将默认进行 lint 检查。你可以通过使用 --ext 标志来自定义扩展名。例如,要仅对 .ts 和 .tsx 文件进行 lint 检查,你可以使用 --ext 选项:npx expo lint --ext .ts,.tsx 或 npx expo lint --ext .js --tsx .tsx。
🌐 All files matching .js, .jsx, .ts, .tsx, .mjs, .cjs extensions will be linted by default. You can customize the extensions by passing the --ext flag. For example, to lint only .ts and .tsx files, you can use the --ext option: npx expo lint --ext .ts,.tsx or npx expo lint --ext .js --tsx .tsx.
如果你需要额外的自定义,可以使用 -- 操作符传递额外的参数。例如,要向 ESLint 传递 --no-error-on-unmatched-pattern 标志,你可以运行:
🌐 If you need additional customization, you can pass extra arguments using the -- operator. For example, to pass the --no-error-on-unmatched-pattern flag to ESLint, you can run:
- npx expo lint -- --no-error-on-unmatched-pattern如果你需要更多自定义,你可以直接使用 npx eslint。
🌐 If you need more customization, you can use npx eslint directly.
了解更多关于在 Expo 项目中使用 ESLint 确保最佳实践的信息。
配置
🌐 Config
通过运行以下命令来评估应用配置(app.json 或 app.config.js):
🌐 Evaluate the app config (app.json, or app.config.js) by running:
- npx expo config--full:包括所有项目配置数据。--json:以 JSON 格式输出,有助于将 app.config.js 转换为 app.config.json。-t, --type:配置类型 显示。
配置类型
🌐 Config type
从应用配置生成三种不同的配置类型:
🌐 There are three different config types that are generated from the app config:
public:用于 OTA 更新的清单文件。可以把它看作是原生应用的index.html文件中的<head />元素。prebuild:用于 Expo Prebuild 的配置,包括异步修饰符。这是配置唯一一次不可序列化的情况。introspect:prebuild配置的一个子集,只显示内存中的修改,如Info.plist或 AndroidManifest.xml 的更改。了解更多关于 内省 的信息。
安装
🌐 Install
与网页不同,React Native 不向后兼容。这意味着 npm 包通常需要与项目中当前安装的 react-native 版本完全匹配。Expo CLI 提供了一个尽力而为的工具,通过使用流行包的列表和已知可行的版本组合来实现这一点。只需将 install 命令作为 npm install 的替代即可使用:
🌐 Unlike the web, React Native is not backwards compatible. This means that npm packages often need to be the exact right version for the currently installed copy of react-native in your project. Expo CLI provides a best-effort tool for doing this using a list of popular packages and the known working version combinations. Simply use the install command as a drop-in replacement for npm install:
- npx expo install expo-camera运行此命令的单个实例,你还可以安装多个包:
🌐 Running a single instance of this command, you can also install multiple packages:
- npx expo install typescript expo-sms你可以使用 -- 操作符直接向底层包管理器传递参数:
🌐 You can directly pass arguments to the underlying package manager by using the -- operator:
- yarn expo install typescript -- -D# yarn add typescript -D版本验证
🌐 Version validation
你可以使用 --check 和 --fix 标志来执行验证和纠正:
🌐 You can perform validation and correction with the --check and --fix flags:
--check:检查哪些已安装的软件包需要更新。--fix:自动更新任何无效的软件包版本。
示例:
🌐 Example:
# Check all packages for incorrect versions, prompt to fix locally- npx expo install --checknpx expo install --check 会提示你关于安装不正确的软件包的信息。它还会提示你将这些软件包本地安装为兼容版本。在持续集成(CI)中,它会以非零状态退出。这意味着你可以使用它进行持续的不可变性验证。相比之下,npx expo install --fix 会在需要时始终修复软件包,无论环境如何。
你可以通过传递特定包来验证它们:
🌐 You can validate specific packages by passing them:
# Check only react-native and expo-sms- npx expo install react-native expo-sms --check命令 npx expo install expo-camera 和 npx expo install expo-camera --fix 具有相同的用途,--fix 命令对于升级项目中的所有包非常有用,例如:
🌐 The command npx expo install expo-camera and npx expo install expo-camera --fix serve the same purpose, the --fix command is useful for upgrading all packages in your project like:
- npx expo install --fix配置依赖验证
🌐 Configuring dependency validation
在某些情况下,你可能希望使用与 npx expo install 推荐的版本不同的包版本。在这种情况下,你可以在项目的 package.json 中使用 expo.install.exclude 属性来排除特定的包进行版本检查。
🌐 There may be circumstances where you want to use a version of a package that is different from the version recommended by npx expo install. In this case, you can exclude specific packages from version checking by using the expo.install.exclude property in your project's package.json.
安装包管理器
🌐 Install package managers
npx expo install 支持 bun、npm、pnpm 和 yarn。
你可以强制包管理器使用命名参数:
🌐 You can force the package manager using a named argument:
--bun:使用bun安装依赖。当存在 bun.lockb 或 bun.lock 时为默认选项。--npm:使用npm来安装依赖。当存在 package-lock.json 时为默认选项。--pnpm:使用pnpm安装依赖。当存在 pnpm-lock.yaml 文件时为默认选项。--yarn:使用yarn来安装依赖。当存在 yarn.lock 时为默认选项。
验证
🌐 Authentication
Expo CLI 提供可与 npx expo start 命令一起使用的身份验证方法。身份验证用于对清单进行“代码签名”,以便安全地使用 OTA。可以把它想象成网络上的 HTTPS。
🌐 Expo CLI provides authentication methods to use with the npx expo start command. Authentication is used to "code sign" manifests for secure OTA usage. Think of this like HTTPS on the web.
- 在
npx expo register注册一个账户。 - 使用
npx expo login登录你的账户。 - 检查当前哪个账户已使用
npx expo whoami进行身份验证。 - 使用
npx expo logout登出。
这些凭证在 Expo CLI 和 EAS CLI 之间共享。
🌐 These credentials are shared across Expo CLI and EAS CLI.
定制
🌐 Customizing
有时你可能想自定义一个原本会由 Expo CLI 在内存中生成的项目文件。当使用 Expo CLI 以外的工具时,你需要有默认的配置文件,否则你的应用可能无法按预期工作。你可以通过运行以下命令来生成文件:
🌐 Sometimes you may want to customize a project file that would otherwise be generated in memory by Expo CLI. When utilizing tools other than Expo CLI, you'll need to have the default config files present, otherwise your app may not work as expected. You can generate files by running:
- npx expo customize从这里,你可以选择生成基本项目文件,例如:
🌐 From here, you can choose to generate basic project files like:
- babel.config.js -- Babel 配置。如果你计划使用除了 Expo CLI 之外的工具来打包你的项目,则必须存在此文件。
- webpack.config.js -- Web 开发的默认 webpack 配置。
- metro.config.js -- 通用开发的默认 Metro 配置。使用
npx react-native时需要此配置。 - tsconfig.json -- 创建一个 TypeScript 配置文件并安装所需的依赖。
环境变量
🌐 Environment variables
| Name | Type | Description |
|---|---|---|
HTTP_PROXY | string | HTTP/HTTPS proxy URL to connect for all network requests. Configures Undici EnvHttpProxyAgent. |
EXPO_NO_WEB_SETUP | boolean | Prevents the CLI from forcing web dependencies (react-dom, react-native-web, @expo/webpack-config) to be installed before using web functionality.This is useful for cases where you wish to perform non-standard web development. |
EXPO_OFFLINE | boolean | Skip all network requests when applicable. This leads to faster development in areas with poor network connection. |
EXPO_NO_TYPESCRIPT_SETUP | boolean | Prevents the CLI from forcing TypeScript to be configured on npx expo start.For more information, see TypeScript guide. |
DEBUG=expo:* | string | Enables debug logs for the CLI, you can configure this using the debug convention. |
EXPO_DEBUG | boolean | An alias for DEBUG=expo:*. |
EXPO_PROFILE | boolean | Enable profiling stats for the CLI, this does not profile your application. |
EXPO_NO_CACHE | boolean | Disable all global caching. By default, app config JSON schemas, Expo Go binaries for simulators and emulators, and project templates are cached in the global .expo directory on your machine. |
CI | boolean | When enabled, the CLI will disable interactive functionality, skip optional prompts, and fail on non-optional prompts. Example: CI=1 npx expo install --check will fail if any installed packages are outdated. |
EXPO_NO_TELEMETRY | boolean | Disables anonymous usage collection. Learn more about telemetry. |
EXPO_NO_GIT_STATUS | boolean | Skips warning about git status during potentially dangerous actions like npx expo prebuild --clean. |
EXPO_NO_REDIRECT_PAGE | boolean | Disables the redirect page for selecting an app, that shows when a user has expo-dev-client installed, and starts the project with npx expo start instead of npx expo start --dev-client. |
EXPO_PUBLIC_FOLDER | string | Public directory path to use with Metro for web. Learn more about customizing Metro. Default: public |
EDITOR | string | Name of the editor to open when pressing O in the Terminal UI. This value is used across many command line tools. |
EXPO_EDITOR | string | An Expo-specific version of the EDITOR variable which takes higher priority when defined. |
EXPO_IMAGE_UTILS_NO_SHARP | boolean | Disable the usage of global Sharp CLI installation in favor of the slower Jimp package for image manipulation. This is used in places like npx expo prebuild for generating app icons. |
EXPO_TUNNEL_SUBDOMAIN | boolean | Experimental exp.direct as the hostname for --tunnel connections. This enables https:// forwarding which can be used to test universal links on iOS. This may cause unexpected issues with expo-linking and Expo Go. Select the exact subdomain to use by passing a string value that is not one of: true, false, 1, 0. |
EXPO_METRO_NO_MAIN_FIELD_OVERRIDE | boolean | Force Expo CLI to use the resolver.resolverMainFields from the project's metro.config.js for all platforms. By default, Expo CLI will use ['browser', 'module', 'main'], which is the default for webpack, for the web and the user-defined main fields for other platforms. |
EXPO_NO_INSPECTOR_PROXY | boolean | Deprecated This includes support for the network inspector. |
EXPO_NO_CLIENT_ENV_VARS | boolean | Prevent inlining EXPO_PUBLIC_ environment variables in client bundles. |
EXPO_NO_DOTENV | boolean | Prevent all .env file loading across Expo CLI. |
EXPO_NO_METRO_LAZY | boolean | Prevent adding the lazy=true query parameter to Metro URLs (metro@0.76.3 and greater). This disables import() support. |
EXPO_USE_TYPED_ROUTES | boolean | Use expo.experiments.typedRoutes to enable statically typed routes in Expo Router. |
EXPO_METRO_UNSTABLE_ERRORS | boolean | Deprecated |
EXPO_USE_METRO_WORKSPACE_ROOT | boolean | Deprecated: SDK 52+ |
EXPO_NO_METRO_WORKSPACE_ROOT | boolean | SDK 52+ |
EXPO_USE_UNSTABLE_DEBUGGER | boolean | Deprecated: SDK 52+ |
EXPO_ADB_USER | string | Set the user number that should be passed to --user with ADB commands. Used for installing APKs on Android devices with multiple profiles. Defaults to 0. |
EXPO_NO_TELEMETRY_DETACH | boolean | SDK 51+ @expo/cli. This causes the CLI to slow down as it waits for all the events to be sent. |
EXPO_UNSTABLE_ATLAS | boolean | Experimental SDK 51+ EXPO_ATLAS. |
EXPO_ATLAS | boolean | SDK 53+ |
EXPO_NO_BUNDLE_SPLITTING | boolean | Experimental SDK 51+ |
EXPO_USE_METRO_REQUIRE | boolean | SDK 52+ require implementation and string based module IDs. This enables better debugging and deterministic IDs for React Server Components. Does not support legacy RAM bundles. |
EXPO_UNSTABLE_METRO_OPTIMIZE_GRAPH | boolean | Experimental SDK 52+ |
EXPO_UNSTABLE_TREE_SHAKING | boolean | Experimental SDK 52+ |
EXPO_NO_REACT_NATIVE_WEB | boolean | Experimental SDK 52+ |
EXPO_NO_DEPENDENCY_VALIDATION | boolean | SDK 52+ npx expo install and npx expo start. |
EXPO_WEB_DEV_HYDRATE | boolean | Enable React hydration in development for a web project. This can help you identify hydration issues early. |
EXPO_UNSTABLE_LIVE_BINDINGS | boolean | Experimental SDK 54+ |
EXPO_UNSTABLE_LOG_BOX | boolean | Experimental SDK 55+ |
EXPO_NO_QR_CODE | boolean | Prevents the CLI from showing the QR code on console. |
遥测
🌐 Telemetry
Expo 开发工具会收集关于一般使用情况的匿名数据。这有助于我们了解某个功能何时未按预期工作。遥测完全是可选的,你可以通过使用 EXPO_NO_TELEMETRY=1 环境变量来选择退出。
🌐 Expo dev tools collect anonymous data about general usage. This helps us know when a feature is not working as expected. Telemetry is completely optional, you can opt out by using the EXPO_NO_TELEMETRY=1 environment variable.