企业官网建设流程全解析

Expo 快速上手指南：10 分钟跑通你的第一个跨平台移动应用

【免费下载链接】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 三端的原生应用。读完这篇指南，你会明白 Expo 凭什么省掉大量环境配置，并能亲手把第一个项目跑在真实手机上，而不是卡在模拟器里。

一个代码库跑三端：Expo 解决的是什么问题

如果你写过原生应用，大概率经历过这些：iOS 一套 Swift/Objective-C，Android 一套 Kotlin/Java，想顺手支持个 Web 还得再学一套技术。每加一个功能都要在两个代码库各改一遍，签名、依赖、构建配置更是两头折腾。

Expo 的思路是：UI 和业务逻辑用 React 写一次，由原生运行时直接执行——注意，它不是把网页塞进 WebView 那种"套壳"，渲染出来的界面就是系统原生组件。这个仓库里包含 Expo SDK、Modules API（自定义原生模块的规范）、Expo Go 客户端源码、命令行工具、路由器和整套文档源码，也就是说从开发到发布的工具链都开源自带了。

对你来说这意味着：写代码的时间占比大幅上升，配环境、对版本的时间占比大幅下降。

核心能力拆解：Expo 替你干了哪几件事

1. 开箱即用的原生能力模块

Expo SDK 由几十个expo-*模块组成，覆盖相机、定位、地图、音频、文件系统、推送通知等。每个模块背后都有对应的 Kotlin 或 Swift 原生实现，你在 JS/TS 里调用同一套 API 即可。比如expo-image负责图片加载与缓存，expo-maps负责地图展示——仓库里apps/native-component-list这个演示应用就是拿这些模块做真实功能验收的，下图就是它地图模块用到的一张样例底图：

2. 真机秒级预览的开发体验

启动本地开发服务后，手机上的 Expo Go 客户端扫码即可加载你的代码，之后你每次保存，改动都会热更新到手机上，不用重新安装。下面是开发服务启动后在浏览器里看到的效果，页面上显示的就是 Expo 默认模板的欢迎页：

3. SDK 版本体系与持续更新

Expo 按 SDK 版本节奏演进，每个版本锁定配套的 React Native 版本，升级路径有明确的版本文档可查。仓库里也保留着每个版本（如 SDK 54）的发布素材：

另外 JS 代码层支持 OTA（Over-The-Air，空中下载）更新：不改原生代码的小版本可以直接推送给用户，不用等应用商店审核。

从零到跑通：最快启动路径

只要机器上装了 Node.js（建议 18 及以上），下面三步就够了。

第一步，用官方脚手架生成项目，它会帮你装好 CLI 和全部依赖：

npx create-expo-app MyFirstApp

提醒一下：网上很多老教程让你npm install -g expo-cli，那个老版 CLI 已经废弃了，现在一律用expo命令（由npx临时调用），别再跟着装了。

第二步，进入项目并启动开发服务：

cd MyFirstApp npx expo start

第三步，选择运行方式：

• 终端里按i或a唤起 iOS / Android 模拟器；
• 手机装一个 Expo Go 应用（应用商店搜得到），确保和电脑同一网络，扫终端里的二维码，真机立刻跑起来；
• 按w则打开浏览器里的 Web 版本。

看到"Welcome to Expo"字样，恭喜你，链路已经全通了。

实战技巧与常见坑点

• Expo Go 能跑，但不等于万能。它预装了一整套 Expo 模块，日常开发足够；但一旦你要引入第三方原生依赖、写自己的原生代码，就需要自定义客户端。做法是用 prebuild 命令生成 android/ios 原生工程（见上文代码块 3 位置的npx expo prebuild），再基于它构建开发客户端——这是官方推荐路径，不用" eject（跳出）"式地整份接管工程。
• 加原生功能优先用 Config Plugin（配置插件）。改图标、换包名、开推送权限这类事，插件会自动写入原生工程配置，你只维护 JS 层，升级 SDK 时不会和原生工程打架。
• 版本升级跟着 SDK 走。Expo SDK 版本和 React Native 版本是绑定的，升级时对照 docs 里的版本目录 一步步来，别单独升 React Native。
• 路由直接用 Expo Router。它基于文件系统做路由（文件即页面），新项目默认模板就带好了，省去自己拼装导航库的精力，源码在 packages/expo-router。
• 图片等资源加载建议用expo-image而不是裸用<Image>，它有更好的缓存策略和占位图支持，仓库里这张建筑照片就是演示项目里图片组件的加载素材：

• 卡住时先查"是不是 Expo Go 的限制"。某些 API 标注了需要自定义客户端，报错前先翻模块文档里的 Platform / Client 说明，能省一半排查时间。

生态工具一览

• EAS Build / Update / Submit：官方托管服务，云端构建、OTA 更新、提交应用商店一条龙，没有 Mac 也能出 iOS 包。
• Expo Go：真机预览客户端，开发期最高频的工具。
• Snack：浏览器里的在线代码沙盒，贴段代码就能跑，适合调试和分享。
• Expo Router：文件系统路由，React Native 侧目前最省心的方案之一。
• Modules API + autolinking：想写自己的原生模块时，按规范开发 JS + Kotlin/Swift 代码即可自动链接进工程。
• jest-expo：基于 Jest 的测试环境，组件和逻辑测试开箱即用。

一句话总结：先用npx create-expo-app+npx expo start把真机跑通，需要原生定制再上 prebuild 和配置插件，发布环节交给 EAS——这就是用 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