部署你的第一个 Expo Router 和 React 应用
了解如何将你的 Expo Router 和 React 应用部署到 EAS Hosting。
EAS Hosting 是一种反应托管服务，可让你将导出的 Expo Web 构建部署到预览或生产 URL。
¥EAS Hosting is a react hosting service that allows you to deploy an exported Expo web build to a preview or production URL.
本指南将引导你完成创建第一个 Web 部署的过程。
¥This guide will walk you through the process of creating your first web deployment.
为什么选择 EAS 托管
¥Why EAS Hosting
从历史上看，建议使用传统的网站托管服务来部署 Expo Router 和 React 应用。但是，这种方法并不能解决处理原生应用的独特挑战。以下是一些关键限制：
¥Historically, traditional website hosting services were recommended for deploying Expo Router and React apps. However, this approach doesn't address the unique challenges of dealing with native apps. Here are some key limitations:
-
版本同步：在应用商店发布过程中，你可能需要部署服务器的新版本。
¥Version synchronization: During the app store publishing process, you may need to deploy new versions of your servers.
-
请求路由复杂度：原生应用的不同版本可能需要路由到特定的服务器版本。这会在处理请求时产生额外的复杂性。
¥Request routing complexity: Different versions of your native app may require routing to specific server versions. This can create additional complexity when handling requests.
-
特定于平台的分析：运行原生应用时，你需要增强平台特定指标的可观察性。
¥Platform-specific analysis: When running native apps, you need enhanced observability for platform-specific metrics.
EAS Hosting 的引入旨在解决这些限制。
¥The introduction of EAS Hosting aims to address these limitations.
先决条件
¥Prerequisites
An Expo user account
EAS Hosting is available to anyone with an Expo account, regardless of whether you pay for EAS or use the Free plan. You can sign up at expo.dev/signup.
Paid subscribers can create more deployments, have more bandwidth, storage, requests, and may set up a custom domain. Learn more about different plans and benefits at EAS pricing.
An Expo Router web project
If using an existing project, ensure that in your project's app config, the web output (expo.web.output) is set to either static or server (single page apps are not supported on EAS Hosting).
Don't have a project yet? No problem. It's quick and easy to create a "Hello world" app that you can use with this guide.
Run the following command to create a new project:
- npx create-expo-app@latest my-app1
Install the latest EAS CLI
EAS CLI is the command line app you will use to interact with EAS services from your terminal. To install it, run the command:
- npm install --global eas-cliYou can also use the above command to check if a new version of EAS CLI is available. We encourage you to always stay up to date with the latest version.
We recommend using
npminstead ofyarnfor global package installations. You may alternatively usenpx eas-cli@latest. Remember to use that instead ofeaswhenever it's called for in the documentation.
2
3
Prepare your project
In your app config file set expo.web.output to either static or server.
static: Exports your Expo app to a statically generated web appserver: Supports server functions and API routes as well as the static pages for your website
Don't worry if you're not sure which output mode you need, you can always change this value later and re-deploy.
4
Now publish your website to EAS Hosting:
- eas deployThe first time you run this command, it will:
- Prompt you to connect an EAS project if you haven't done so yet
- Ask you to choose a preview subdomain name
A preview subdomain name is a prefix used for the preview URL of your app.
例如，如果你选择 my-app 作为预览子域名，你的预览 URL 将如下所示：https://my-app--or1170q9ix.expo.app/，你的生产 URL 将是：https://my-app.expo.app/。
¥For example, if you choose my-app as your preview subdomain name, your preview URL would look something like this: https://my-app--or1170q9ix.expo.app/, and your production URL would be: https://my-app.expo.app/.
部署完成后，CLI 将输出可访问部署应用的预览 URL，以及 EAS 仪表板上的部署详细信息链接。
¥Once your deployment is complete, the CLI will output a preview URL for where your deployed app is accessible, as well as a link to the deployment details on the EAS Dashboard.