ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

Expo 十分钟上手指南:用一条命令跑通 Android、iOS 与 Web 应用

Expo 十分钟上手指南:用一条命令跑通 Android、iOS 与 Web 应用 Expo 十分钟上手指南用一条命令跑通 Android、iOS 与 Web 应用【免费下载链接】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/expoExpo 是开源的跨端应用框架写一套 React 代码同时编译到 Android、iOS 和 Web 三个平台。它把 React Native 生态里最劝退的部分——原生工程配置、依赖安装、原生模块桥接——打包成开箱即用的命令。装好 Node.js 之后你只需一条npx命令生成项目再执行expo start扫一个二维码十分钟内在手机上看自己的第一个界面。用 create-expo-app 一条命令完成项目初始化Expo 项目不从空目录手写起步而是从模板生成。模板就放在仓库的 templates/ 目录下包括default带示例页面、blank纯 JS、blank-typescript纯 TS、tabs底部导航和bare-minimum最小原生工程五种创建时交互式选择。生成后直接启动开发服务器npx create-expo-applatest my-app cd my-app npx expo startexpo start会起一个本地开发服务器并展示二维码改代码即时热更新不用重新安装应用。用 Expo Go 连接真机或用模拟器离线跑expo start的二维码不是随便扫的手机装上 Expo Go 客户端 后扫码即可加载你的 JS 代码运行在真机上全程不需要安装 Android Studio 或 Xcode。没有真机也不碍事expo start按a或i可在 Android / iOS 模拟器中启动效果如下Expo SDK相机、定位、通知开箱即用应用能跑起来只是起点Expo 真正解决的是调用设备能力要写多少原生代码这个痛点。SDK 以独立 npm 包形式提供每个模块都自带 TypeScript 接口和 Kotlin/Swift 实现npm install即可用expo-camera相机拍摄、视频录制expo-locationGPS 定位与连续追踪expo-notifications本地与推送通知expo-router文件路由用目录结构声明页面expo-sqlite、expo-secure-store本地存储与加密存储模块清单可以看 expo 主包 与 expo-camera 的目录结构一个模块下src/、android/、ios/三层并列这正是一套代码、原生实现的直观体现。需要原生代码时prebuild 生成完整工程当你要写 Kotlin/Swift 或修改Info.plist时npx expo prebuild会按当前配置一键生成android/和ios/原生工程之后再交给 Android Studio 或 Xcode 处理改配置图标、包名、签名则用 Config Plugins 声明式完成不碰原生源码。创建自定义开发构建Development Build用的expo-dev-client也走同一条链路CLI 相关逻辑可参考 Expo CLI 源码。npx expo prebuild常见卡点 真机扫码失败手机和电脑必须连同一 Wi-Fi隔网调试时改用expo start --tunnel。API 报不支持Expo Go 只内置固定版本 SDK 的模块本地 SDK 版本与 Expo Go 版本对不上时先升级 Expo Go 或改用 Development Build。依赖冲突项目内引入的第三方原生库版本需与当前 Expo SDK 对齐以 官方文档 的版本说明为准。下一步建议想快速过一遍各模块的真实用法可以翻 native-component-list 这个组件演示应用它把默认 SDK 里的组件和 API 逐一做成了可交互页面。【免费下载链接】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),仅供参考
返回列表