news 2026/9/11 11:55:59

5 分钟跑通三端 Expo 应用:新手向完整指南

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
5 分钟跑通三端 Expo 应用:新手向完整指南

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.jsonexpo包版本一致。解法:安装匹配 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),仅供参考

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/9/11 11:55:43

打破AI分析垄断:构建大模型多元评估体系实践指南

最近在给团队做 AI 产品方案评审时,我注意到一个特别的现象:不论讨论什么场景——客服、写作、代码生成、还是企业知识库问答,最后大家都会回到同一套话语体系里,比如“对齐”“幻觉”“温度参数”“评测集分数”。这些词本身没有…

作者头像 李华
网站建设 2026/9/4 14:40:04

Tokens per Second:大模型推理速度的测量与优化全解析

看到 Celeris-1 以 2158 tokens/s 的生成速度登顶 AI 推理速度排行榜时,很多开发者的第一反应是:这个数字到底意味着什么?在真实项目中能不能复现?我自己部署模型之后,怎样测量并优化这个指标? 本篇文章不…

作者头像 李华
网站建设 2026/9/3 12:21:29

drawio-desktop 如何三步完成 Visio 文件迁移与跨平台图表协作

drawio-desktop 如何三步完成 Visio 文件迁移与跨平台图表协作 【免费下载链接】drawio-desktop Official electron build of draw.io 项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop 团队的 Visio 图纸被锁在一台 Windows 机器里,别人在…

作者头像 李华
网站建设 2026/9/4 1:36:11

Apple ID安全机制与合法管理实践指南

简介:这是一套面向iOS开发者、Apple生态运维人员及高级个人用户的Apple ID自动化安全管理工具集,聚焦账号异常锁定后的快速恢复与日常安全策略批量执行。工具支持自动解锁被锁定的Apple ID、一键关闭双重验证、批量修改密码、清理冗余登录设备&#xff0…

作者头像 李华
网站建设 2026/9/3 2:06:35

3 种 goose 部署方式,哪种适合你?

3 种 goose 部署方式,哪种适合你? 【免费下载链接】goose an open source, extensible AI agent that goes beyond code suggestions - install, execute, edit, and test with any LLM 项目地址: https://gitcode.com/GitHub_Trending/goose3/goose …

作者头像 李华