前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >使用Expo开发React-native程序(一)

使用Expo开发React-native程序(一)

原创
作者头像
蒙古上单2
发布于 2024-04-09 01:43:33
发布于 2024-04-09 01:43:33
2.1K2
举报
文章被收录于专栏:第二蒙古上单第二蒙古上单

开发React-native程序,除了官方提供的React-native CLI外,目前还有一个新的选择Expo。

Expo通过编写React和js代码,来生成IOS app、安卓app和web端应用。它主要包括两个工具:

Expo CLI命令行工具,用来创建脚手架、运行、build程序。

Expo Go:安装在真机或虚拟机上的app,可以直接运行你构建出来的项目(不需要签名),方便debug和测试。

如何使用:

1.全局安装Expo CLI工具

代码语言:shell
AI代码解释
复制
npm install -g expo-cli

2.创建项目(假设项目名称为expo-1)

代码语言:shell
AI代码解释
复制
expo init expo-1

或者

代码语言:shell
AI代码解释
复制
npx create-expo-app expo-1

3.安装其他依赖项

如果是苹果M1、M2芯片,需安装watchman

代码语言:shell
AI代码解释
复制
brew install watchman

4.启动

代码语言:shell
AI代码解释
复制
npm start

启动完成后,可以在web端查看效果:http://localhost:8081/

也可以按 i 启动IOS虚拟机(前提是你已经安装了xcode和IOS虚拟机),启动IOS虚拟机后expo会首先给你安装Expo Go,如下图所示:

安装好后就可以正式进入app了,效果如下:

expo支持热更新,编辑保存后会立即rebuild并立即显示到模拟器上。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
2 条评论
热度
最新
你好,我在运行中输入npm install -g expo-cli 后怎么没反应呀
你好,我在运行中输入npm install -g expo-cli 后怎么没反应呀
回复回复点赞举报
你好,我在运行中输入命令后怎么没反应呀
你好,我在运行中输入命令后怎么没反应呀
回复回复点赞举报
推荐阅读
编辑精选文章
换一批
🧭 React Native 版本升级指南
React Native 作为一款跨端框架,有一个最让人头疼的问题,那就是版本更新。尤其是遇到大版本更新,JavaScript、iOS 和 Android 三端的配置构建文件都有非常大的变动,有时候三者的配置文件又互相耦合在一起,往往牵一发而动全身。
卤代烃
2022/02/23
4.8K0
🧭 React Native 版本升级指南
最新React Native环境搭建(从0到打包APK)
React Native 之旅 React Native 踩坑开始 5.1 假期 就这样短暂的结束了,你都干啥了? 😂,我嘛加了3天班,你们呢? 最近公司有个React Native 项目,不得不学习下RN了。由于之前学过React,学React Native 过程还算可以,不太艰难。 学习React Native 踩了好多坑,总结文章,以便别的小伙伴开发RN,可以轻松上手,减少踩坑。😂 ​ ---- ​ React Native 环境 安装(必须按照以下3个要求配置安装,否则会环境错
程序员海军
2021/10/08
4.7K0
最新React Native环境搭建(从0到打包APK)
Flutter正在悄悄击败React-Native?
事情是这样的,由于最近想做个APP,于是我考虑下技术选型,便在gitHub看了看,于是发现了一个让我惊讶的点:
童欧巴
2021/08/20
1.2K0
Flutter正在悄悄击败React-Native?
React-Native For Android 环境搭建及踩坑
安装环境 本文默认以MacOS为系统,毕竟除了用React Native搞Android,你也会想用它搞iOS。 首先当然是Android的环境搭建,这里还是推荐把整个Android开发环境都弄起来,顺便还可以学学Android。关于Android环境搭建,以及使用Android Studio可以参考我的另一篇文章搭建安卓开发环境(Android Studio) 这里就不赘述了,需要注意的是,要安装好SDK,AVD(不是AV,是Android Virtual Device)。 弄好Android开发环境
Bob.Chen
2018/05/02
1.8K0
react-native 项目初始化
react-native 项目初始化 搭建java,android,node环境 http://www.cnblogs.com/morang/p/react-native-java-build.html 全局安装脚手架 npm install react-native-cli -g 使用react-native-cli初始化项目 react-native init 项目名称 修改android/gradle/wrapper/gradle-wrapper.properties文件的distrib
易墨
2018/09/14
9520
react-native 项目初始化
React-Native入门指南(一)
最近手头的工作繁多,有研究性的项目和系统研发,正好遇到同事离职,接手了框架的UI组件,不仅需要维护和填坑,还需要开发新的功能组件。因为身在H5-Hybird的框架部门,最近团队开始尝试使用React-Native来做些东西。之前也有过开发iOS App的冲动,学了点Object-c,这次正好借此机会进入App开发,以弥补自己在Native-App上的经验不足。
疯狂的技术宅
2019/03/28
2.4K0
React-Native入门指南(一)
React-native - Install & Lauch & Filling Holes
Mitchell Install First step: install react-native: //Make sure you have npm, if not install it. brew install npm //Install create-react-native-app npm install -g create-react-native-app //Install react-native-cli npm install -g react-native-cli --
Mitchell
2018/09/30
5800
React-native - Install & Lauch & Filling Holes
新建一个简单的React-Native工程
(3)安装node.js:https://nodejs.org/download/
conanma
2021/11/02
9800
配置React Native环境
配置React Native环境 一. 安装Homebrew: “Homebrew installs the stuff you need that Apple didn’t.——Homebrew  OS X 更完整”。 Homebrew的官网(多语言版本)简单明了地介绍了如何安装和使用这个工具,;并提供了自己的Wiki。 brew的安装很简单,使用一条ruby命令即可,Mac系统上已经默认安装了ruby": ruby -e "$(curl -fsSL https://raw.githubuserconte
用户1941540
2018/05/11
9590
xcode工程集成 React-native步骤
跟着网上博客步骤来集成RN发现了很多坑,但是博客内容里面却没有记录这些坑,百度了很久都没找到解决方案,最后还是在谷歌搜索里面的一篇文章找到解决办法,在此记录下方便别人快速集成RN。
conanma
2021/11/02
2.5K0
React Native简介和环境配置
           Facebook于2015年9月15日发布React Native,广大开发者可以使用JavaScript和React开发跨平台移动应用,React Native提倡组件化开发,即提供一个个封装好的组件,然后组件相互嵌套形成新的组件。
星宇大前端
2019/01/15
1.6K0
React Native介绍及开发环境(Mac)搭建
曾经有这么一个说法:世上凡能用JavaScript实现之事物,最后都用JavaScript实现了。
一粒小麦
2019/09/09
3.1K0
React Native介绍及开发环境(Mac)搭建
新奇篇 之 Mac 配置 React Native 0.56
据说后期的项目会涉及到 React Native,今天在等待导入依赖的期间,简单配置了一波,特此做个记录。
贺biubiu
2019/03/21
1K0
新奇篇 之 Mac 配置 React Native 0.56
react native 入门实战(一)
作者:朱灵子 本文举一个简单的例子介绍如何进行react native实战开发,主要从以下几个方面来进行介绍: 如何在mac IOS下进行react native环境配置 写一个简单的例子,分析rea
腾讯IVWEB团队
2017/04/27
8.6K0
React Native 环境配置的坑
一直想试试RN,但是因为安装环境的问题一直没有成功,中间陆陆续续因为时间的原因中断了一段时间,今天终于鼓起勇气再次冲击·····,先说一下我之前安装环境的坑爹史吧。 刚刚开始我是按照下面的按照方法安装的: ---- 1、首先需要安装 Homebrew,安装只要一句话:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)",判断安装成功与否,可以用命令查看:b
傅_hc
2018/06/28
9990
React Native学习笔记(二)—— 概要、开发环境搭建、第一个React Navite程序
在移动端开发项目中。开发资源不够时,同时由两个团队维护安卓和IOS两套原生APP是成本很高的。此时,就需要选择一个同时支持多平台的客户端开发框架,能够使用一套代码,编译出多平台的APP。
张果
2023/04/01
3.9K0
React Native学习笔记(二)—— 概要、开发环境搭建、第一个React Navite程序
React Native 环境搭建和创建项目(Mac)
搭建基本环境(必要) 使用React Native开发iOS应用需要OSX系统,Xcode,Homebrew,node,npm,也可以有选择的使用watchman 、Flow。 1. 安装Homebrew Homebrew, 简称brew, Mac系统的包管理器, 用于安装NodeJS和一些其他必需的工具软件。 Home-brew 的使用方式: 1)搜索软件:brew search 软件名,如brew search wget 2)安装软件:brew install 软件名,如brew install wge
IT架构圈
2018/06/01
2.1K0
学习 React Native for Android:环境搭建
学习 React Native for Android 的开发环境搭建。 Facebook 于 2015 年 9 月 15 日发布了 React Native for Android 。React Native 让开发者使用 JavaScript 和 React 编写应用,利用相同的核心代码就可以创建 Web,iOS 和 Android 平台的原生应用。注意这里的 核心 两个词,它指的是那些底层的、与界面无关的逻辑。与 ionic / PhoneGap 这类 Web App 开发框架不同,React Na
HaHack
2018/07/03
1.6K0
使用umi开发react-native应用
自此,开发者可以迅速投入到业务代码的开发,而不用去搭建脚手架,写一堆配置和胶水代码去整合各种框架等等。
conanma
2021/11/02
6.9K0
React-Native 入门
React Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架,是Facebook早先开源的UI框架 React 在原生移动应用平台的衍生产物,目前支持iOS和安卓两大平台。RN使用Javascript语言,类似于HTML的JSX,以及CSS来开发移动应用,因此熟悉Web前端开发的技术人员只需很少的学习就可以进入移动应用开发领域。
conanma
2021/11/02
3.1K0
相关推荐
🧭 React Native 版本升级指南
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档