5 分钟跑通三端 Expo 应用:新手向完整指南
【免费下载链接】expoAn open-source framework for making universal native apps with React. Expo runs on Android, iOS, and the web.项目地址: https://gitcode.com/GitHub_Trending/ex/expo
Expo 是一个开源框架,让你用 React 写出原生运行的 Android、iOS 和 Web 应用,附带一套原生能力模块(SDK)和完整开发工具链。本文用 5 分钟讲清楚:它是什么、怎么跑起来、新手会踩哪些坑。
环境准备 → 最小跑通
前置条件只有一个:电脑装好 Node.js LTS。macOS、Windows、Linux 都支持,不需要先装 Xcode 或 Android Studio。
安装与初始化
一条命令生成项目。create-expo-app是脚手架工具,默认模板自带示例代码:
npx create-expo-app@latest --template default cd YourProjectName启动并确认运行
npx expo start开发服务器启动后会显示二维码:用手机的 Expo Go 扫码,或按 i / a / w 分别打开 iOS、Android 模拟器和网页。看到 "Welcome to Expo" 界面即成功。
核心能力拆解
Expo Go:不编译原生代码就能真机跑
Expo Go 是装在应用商店里的"万能容器" App。你npx expo start后,手机扫码就能运行项目代码。真实场景:你刚写完一个页面,想马上看真机效果——等原生编译太慢,扫码只要几秒。什么时候用:学习期和早期开发,几乎所有时间都靠它。仓库里 apps/expo-go/ 就是 Expo Go 自身的源码。
Expo SDK:一组现成的原生能力模块
SDK 是一系列 Expo Module,每个对应一种原生能力:expo-image高性能图片加载、expo-camera相机、expo-location定位。真实场景:做图片瀑布流时直接用 SDK 的 Image 组件加载图片,不用自己封装原生图片库。什么时候用:只要你要碰设备原生能力,就轮到它。
Prebuild 与开发构建:从沙盒走向生产
Expo Go 是学习沙盒,上架需要开发构建。Prebuild 会从你的配置重新生成android/和ios/原生目录。真实场景:产品要接入自定义原生代码,或要打包提交应用商店。什么时候用:项目过了学习阶段、准备发布时。
工具链与扩展生态
按开发阶段分三组看:
开发阶段
- create-expo-app:脚手架,一条命令生成项目,可以选模板也可以直接从官方示例起步。
- Expo CLI:管理依赖、启动开发服务器、连接任意设备。
- templates/:CLI 生成的项目模板源码都在这,想看默认项目长什么样可以直接翻。
调试阶段
- Expo Go:最快的真机验证手段。
- expo-doctor:一条命令体检项目,专查依赖版本错配这类"玄学"问题。
部署阶段
- EAS(Expo Application Services):云端构建、更新、提交应用商店的托管服务,文档在 docs/pages/eas/。
- expo-updates:OTA 更新模块,发 JS 更新不用重新过审。
新手高频踩坑
问:提示 "Project is incompatible with this version of Expo Go"?每个 Expo Go 只内置一个 SDK 版本,必须和package.json里expo包版本一致。解法:安装匹配 SDK 的 Expo Go 构建,或把项目版本对齐商店版 Expo Go。详见 troubleshooting 页面。
问:报 Application "main" has not been registered?这多半是红鲱鱼——真正的错误是 JS 加载阶段更早抛出的异常,导致应用没来得及注册。先往上翻日志找真实报错,常见原因是同一原生依赖装了两份不同版本。分析见 application-has-not-been-registered.mdx。
问:改了代码没生效,或一启动就崩?大概率是打包缓存过期。执行npx expo start --clear清 Metro 缓存重启即可;macOS/Linux 的完整清缓存流程在 docs。
问:已有的 React Native 项目能装 Expo 吗?可以。exponpm 包几乎能装进任何 React Native 项目,CLI、SDK 模块、EAS 都能直接用。更多问答见 docs/pages/faq.mdx。
下一步去哪
- 官方文档入口:docs/pages/get-started/,从 Create a project 一路读下来。
- 进阶方向一:用 Expo Modules API 写自己的原生模块(Swift/Kotlin)。
- 进阶方向二:expo-router,基于文件的路由,适合多页面应用。
- 贡献入口:CONTRIBUTING.md,面向贡献者的内部教程在 guides/。
【免费下载链接】expoAn open-source framework for making universal native apps with React. Expo runs on Android, iOS, and the web.项目地址: https://gitcode.com/GitHub_Trending/ex/expo
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考