当前位置： 首页 > news >正文

如何新建一个React Native的项目

news 文章来源：https://blog.csdn.net/weixin_51943308/article/details/143042787 2024/11/26 4:33:29

要新建一个 React Native 项目，你可以使用 React Native 官方推荐的工具 React Native CLI 或者 Expo。两者的区别在于：React Native CLI 提供更多对原生代码的访问权限，适合构建复杂的应用；而 Expo 是一个开发工具链，简化了许多设置，非常适合快速启动项目，尤其是小型应用或原生功能需求不高的项目。

下面我将分别介绍如何使用 React Native CLI 和 Expo CLI 来创建一个新的 React Native 项目。

方法 1：使用 React Native CLI

1. 安装必要的工具

你需要安装以下工具：

  • Node.js：JavaScript 运行时，可以从 Node.js 官网下载并安装。
  • React Native CLI：命令行工具，用于创建和管理 React Native 项目。
  • Android Studio（用于 Android 开发）或 Xcode（用于 iOS 开发）。如果只开发 Android 应用，安装 Android Studio 即可。
2. 安装 React Native CLI

打开终端（或命令行窗口），运行以下命令来全局安装 React Native CLI：

npm install -g react-native-cli
3. 创建一个新项目

运行以下命令以创建一个新的 React Native 项目，项目名称可以根据你需求自定义：

npx react-native init MyNewProject

这将创建一个名为 MyNewProject 的新 React Native 项目。

4. 运行项目

在项目目录下执行以下命令来启动应用：

  • 运行 Android 模拟器：

    首先确保你已经打开了 Android Studio 并配置好 Android 虚拟设备（AVD）。然后，运行：

    npx react-native run-android

  • 运行 iOS 模拟器：

    如果你在 macOS 上并安装了 Xcode，可以使用以下命令运行 iOS 模拟器：

    npx react-native run-ios

    注：要运行 iOS 应用，你需要在 macOS 上，并且安装了 Xcode。

5. 开发与调试

一旦模拟器成功启动，你就可以开始在项目文件夹的 App.js 文件中编写代码。每当你保存更改时，React Native 将自动热更新你的应用，无需重新编译。

方法 2：使用 Expo CLI

如果你不需要使用复杂的原生功能，或希望快速开始开发，Expo 是更简单的一种方式，它不需要在初期配置 Android Studio 或 Xcode。

1. 安装 Expo CLI

运行以下命令安装 Expo CLI 工具：

npm install -g expo-cli
2. 创建一个新项目

运行以下命令创建一个新的 Expo 项目：

expo init MyNewProject

接下来会提示你选择一个模板（例如空白模板或带有一些示例代码的模板）。选择适合你的项目的模板。

3. 进入项目目录
cd MyNewProject
4. 启动项目

运行以下命令启动项目：

expo start

这将启动一个开发服务器，你可以使用 Expo Go 应用在 Android 或 iOS 设备上扫码运行你的应用，或者直接在浏览器中查看调试信息。

  • 如果你要在 iOS 模拟器 或 Android 模拟器 上运行，可以选择在 Expo 提供的界面中点击对应的按钮：
    • Press i to open iOS simulator (on macOS).
    • Press a to open Android emulator (if you have one installed).
5. 开发与调试

和 React Native CLI 类似，你可以直接编辑项目中的 App.js 文件，保存后应用会自动刷新更新。

React Native CLI 和 Expo 的对比

功能React Native CLIExpo CLI
复杂的原生功能适合，允许直接修改原生代码限制较多，不适合需要自定义原生功能的项目
开发体验需要设置模拟器（Android Studio/Xcode）更简单的设置，无需复杂的原生环境
构建流程手动设置构建环境，需要更多配置自动化构建流程，适合快速原型开发
调试设备支持通过模拟器和物理设备调试支持通过 Expo Go 应用进行快速调试
代码共享性和性能可直接与原生代码交互，性能更优性能稍逊色，但开发速度较快
适用场景复杂、原生功能丰富的应用简单、快速开发或轻量级的应用

总结

如果你需要使用复杂的原生功能，或者希望完全掌控项目的原生部分，那么选择 React Native CLI 是最佳方案。如果你刚刚开始 React Native 开发，或者想快速搭建一个跨平台应用而不需要复杂的原生功能，那么使用 Expo 是非常方便的选择。

相关文章：

如何新建一个React Native的项目

要新建一个 React Native 项目，你可以使用 React Native 官方推荐的工具 React Native CLI 或者 Expo。两者的区别在于：React Native CLI 提供更多对原生代码的访问权限，适合构建复杂的应用；而 Expo 是一个开发工具链，…...

编程日记 2024/10/26 0:56:49

学习--图像信噪比

目录 图像信噪比 图像信噪比 图像信噪比的计算公式： 其中， M M M和 N N N分别表示图像长度和宽度上的像素数。 f ( i , j ) f(i,j) f(i,j) 和 g ( i , j ) g(i,j) g(i,j)分别是原始图像和去噪后的图像在点 ( i , j ) (i,j) (i,j)处的像素值。 信噪…...

编程日记 2024/10/26 0:51:44

【2024CANN训练营第二季】使用华为云体验AscendC_Sample仓算子运行

环境介绍 NPU：Ascend910B2 环境准备 创建Notebook 华为云选择：【控制台】-【ModelArts】 ModelArts主页选择【开发生产】-【开发空间】-【Notebook】 页面右上角选择【创建Notebook】 选择资源 主要参数 规格：Ascend: 1*ascend-snt…...

编程日记 2024/10/26 0:50:43

使用 NumPy 和 Matplotlib 实现交互式数据可视化

使用 NumPy 和 Matplotlib 实现交互式数据可视化 在数据分析中，交互式可视化可以更好地帮助我们探索和理解数据。虽然 Matplotlib 是静态绘图库，但结合一些技巧和 Matplotlib 的交互功能（widgets、event handlers），我…...

编程日记 2024/10/26 0:49:42

TCP 攻击为何在 DDoS 攻击中如此常见

分布式拒绝服务攻击（Distributed Denial of Service, DDoS）是一种常见的网络攻击手段，通过大量请求使目标服务器过载，导致合法用户无法访问服务。在众多 DDoS 攻击类型中，TCP 攻击尤为常见。本文将探讨 TCP 攻击在 DDo…...

编程日记 2024/10/26 0:48:41

未来汽车驾驶还会有趣吗？车辆动力学系统简史

未来汽车驾驶还会有趣吗？车辆动力学系统简史 本篇文章来源：Schmidt, F., Knig, L. (2020). Will driving still be fun in the future? Vehicle dynamics systems through the ages. In: Pfeffer, P. (eds) 10th International Munich Chassis Symposiu…...

编程日记 2024/10/26 0:47:40

LCD手机屏幕高精度贴合

LCD手机屏幕贴合，作为智能手机生产线上至关重要的一环，其质量直接关乎用户体验与产品竞争力。这一工艺不仅要求屏幕组件间的无缝对接，达到极致的视觉与触觉效果，还需确保在整个生产过程中，从材料准备到最终成品&#x…...

编程日记 2024/10/26 0:43:36

15_卸载操作

在之前我们就提到，首次渲染之后，后续如果再调用 render 函数时，传递的 vnode 为 null 则表示是卸载。 当时我们是直接通过执行 container.innerHTML ‘’ 来实现的，但是这样做会有以下几个问题，如下： 容…...

编程日记 2024/10/26 0:41:33

ONLYOFFICE 文档8.2版本已发布：PDF 协作编辑、改进界面、性能优化等更新

ONLYOFFICE 在线编辑器最新版本已经发布，其中包含30多个新功能和500多个错误修复。阅读本文了解所有更新。 关于 ONLYOFFICE 文档 ONLYOFFICE 是一个开源项目，专注于高级和安全的文档处理。坐拥全球超过 1500 万用户，ONLYOFFICE 是在线办公领…...

编程日记 2024/10/26 0:39:31

redis的string是怎么实现的

Redis 的 String 类型是最基本的数据类型，底层通过多种方式实现，能够存储字符、整数、浮点数等各种形式的值。String 数据结构的实现基于 Redis 的简单动态字符串（SDS），同时在处理不同的数据类型时也进行了优化。 1. …...

编程日记 2024/10/26 0:38:31

基于STM32设计的智能婴儿床(华为云IOT)(244)

文章目录 一、前言1.1 项目介绍【1】开发背景【2】项目实现的功能【3】项目硬件模块组成【4】ESP8266工作模式配置1.2 设计思路【1】整体设计思路【2】整体构架【3】上位机开发思路1.3 项目开发背景【1】选题的意义【2】可行性分析【3】参考文献【4】摘要1.4 开发工具的选择【1…...

编程日记 2024/10/26 0:37:29

html+css+js实现Notification 通知

实现效果&#xff1a; 代码实现&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Notif…...

编程日记 2024/10/26 0:35:27

【Linux】拆分详解 - 常见指令和权限理解

文章目录 前言一、常用指令1. 基本查看与路径跳转1.1文件与目录1.2 ls 指令&#xff08;显示文件&#xff09;1.3 pwd &#xff08;查看当前目录&#xff09;1.4 clear &#xff08;清屏&#xff09;1.5 whoami &#xff08;查看用户名&#xff09;1.6 cd&#xff08;跳转路径&…...

编程日记 2024/10/26 0:34:26

UniHttp 框架，请求http接口

项目案例下载地址： https://download.csdn.net/download/jinhuding/89902024 1.快速开始 2.1引入依赖 <dependency><groupId>io.github.burukeyou</groupId><artifactId>uniapi-http...

编程日记 2024/10/26 0:32:23

C++20中头文件ranges的使用

<ranges>是C20中新增加的头文件&#xff0c;提供了一组与范围(ranges)相关的功能&#xff0c;此头文件是ranges库的一部分。包括&#xff1a; 1.concepts: (1).std::ranges::range:指定类型为range&#xff0c;即它提供开始迭代器和结束标记(it provides a begin iterato…...

编程日记 2024/10/26 0:31:22

设计一个html+css+js的注册页，对于注册信息进行合法性检测

综合使用HTML、JavaScript和CSS进行注册页面设计&#xff0c;实现以下若干功能&#xff1a; 注意整个页面的色调和美观使用FramesetTable布局&#xff08;div也可&#xff09;对用户ID和用户名、口令不符合条件及时判断对口令不一致进行及时判断&#xff08;34的及时判断&#…...

编程日记 2024/10/26 0:30:20

语音识别——使用Vosk进行语音识别

文章目录 前言一、Vosk模型1.准备好所需要的语音包2.下载使用 二、使用示例1.文件读取示例2.结合麦克风演示 总结 前言 如何编译Vosk请参照之前的文章&#xff0c;ubuntu编译kaldi和vosk Vosk是语音识别开源框架&#xff0c;支持二十种语言 - 中文&#xff0c;英语&#xff0…...

编程日记 2024/10/26 0:29:19

element ui中el-image组件查看图片的坑

比如说上传组件使用el-image-viewer组件去看，如果用错了，你会发现，你每次只能看一张图片 <template><div><el-upload action="#" list-type="picture-card" :auto-upload="false" :file-list="fileList"@change=&qu…...

编程日记 2024/10/26 0:28:18

LabVIEW水质监测系统

在面对全球性的海洋污染问题时&#xff0c;利用先进技术进行水质监测成为了保护海洋环境的关键手段之一。开发了一种基于LabVIEW的海洋浮标水质监测系统&#xff0c;该系统能够实时监测并评估近海水域的水质状况&#xff0c;旨在为海洋保护和污染防治提供科技支持。 项目背景 …...

编程日记 2024/10/26 0:22:11

SpringMVC之 文件上传和下载

1. 文件上传 1.1 前端注意事项 文件上传操作&#xff0c;前端的表单项需要如下三项设置&#xff1a; &#xff08;1&#xff09;input标签的type属性应设置为file&#xff0c;并且注意不要在input标签中设置value属性&#xff0c;因为这可能导致文件上传不成功&#xff1b; …...

编程日记 2024/10/26 0:20:09

LeetCode Hot 100：二分查找

LeetCode Hot 100&#xff1a;二分查找 35. 搜索插入位置 思路 1&#xff1a;lower_bound class Solution { public:int searchInsert(vector<int>& nums, int target) {return lower_bound(nums.begin(), nums.end(), target) - nums.begin();} };思路 2&#xf…...

编程日记 2024/10/26 0:19:08

打包方式-jar和war的区别

1、jar包 JAR包是类的归档文件&#xff0c;与平台无关的文件格式&#xff0c;其实jar包就是java的类进行编译生成的class文件进行打包的压缩包。 JAR以ZIP文件格式为基础&#xff0c;与ZIP不同的是&#xff0c;JAR不仅用于压缩和发布&#xff0c;还用于部署和封装库、组件和插…...

编程日记 2024/10/26 0:17:06

【论文+源码】基于spring boot的垃圾分类网站

创建一个基于Spring Boot的垃圾分类网站涉及多个步骤&#xff0c;包括环境搭建、项目创建、数据库设计、后端服务开发、前端页面设计等。下面我将引导您完成这个过程。 第一步&#xff1a;准备环境 确保您的开发环境中安装了以下工具&#xff1a; Java JDK 8 或更高版本Mav…...

编程日记 2024/10/26 0:16:06

【C++ STL 模板类】pair 键值对

文章目录 【 1. pair 对象的创建 】【 2. pair 对象的赋值 】【 3. pair 对象的比较 】【 4. pair对象成员的互换】 C STL 标准库提供了 pair 类模板&#xff0c;专门用来将 2 个普通元素 first 和 second&#xff08;可以是 C 基本数据类型、结构体、类自定的类型&#xff09;…...

编程日记 2024/10/26 0:14:04

paddleocr使用FastDeploy 部署工具部署 rknn 模型

在 PC 端转换 pdmodel 模型为 rknn 模型和在板端使用百度飞浆开发的 FastDeploy 部署工具部署 rknn 模型 以下内容是在 PC 端系统为 Ubuntu20.04&#xff0c;板端系统为ubuntu20.04 的环境下实现的 描述&#xff1a; 官网地址 rknn_zoo RKNPU2_SDK …...

编程日记 2024/10/26 0:13:03

Apple Vision Pro市场表现分析：IDC最新数据揭示的真相

随着AR/VR技术逐渐成熟并被更多消费者接受，2024年第二季度（Q2）成为这一领域的一个重要转折点。根据国际数据公司（IDC）发布的最新报告，整个AR/VR市场在本季度经历了显著的增长。接下来，我们将深入探讨Apple Vision Pro在这股增长浪潮中的具体表现。 市场背景 2024年Q2，…...

编程日记 2024/10/26 0:10:01

Mybatis-04.入门-JDBC

一.JDBC 二.原始的JDBC程序代码 &#xff08;不做要求&#xff09; Test public void testJdbc() throws Exception {//1. 注册驱动Class.forName("com.mysql.cj.jdbc.Driver");//2. 获取连接对象String url "jdbc:mysql://localhost:3306/mybatis";Str…...

编程日记 2024/10/26 0:07:59

拥抱云开发的未来：腾讯云数据库、云模板与AI智能化的应用场景探索

本文目录&#xff1a; &#x1f4a1;前言&#xff1a;技术的边界在不断延展&#x1f31f;目录&#x1f308;什么是腾讯云云开发&#xff1f;&#x1f4be;云数据库&#xff1a;让数据成为开发的稳固基石&#x1f951;数据&#xff0c;不再只是数据 &#x1f6e0;云模板&#xf…...

编程日记 2024/10/26 0:05:56

新手铲屎官求推荐，噪音低的宠物空气净化器应该用哪款

当初选择养橘猫就是因为我听到有人说橘猫不容易掉毛才养的&#xff0c;谁知道养了之后和传闻中的不一样&#xff0c;真正的让我明白了什么叫“眼见为实”。 主要是猫掉毛就掉毛&#xff0c;只要我能清理的我都会清理&#xff0c;只要能保证养猫的同时还能保持家里卫生干净就行…...

编程日记 2024/10/26 0:03:54

玄机平台-应急响应-webshell查杀

首先xshell连接 然后进入/var/www/html目录中&#xff0c;将文件变成压缩包 cd /var/www/html tar -czvf web.tar.gz ./* 开启一个http.server服务&#xff0c;将文件下载到本地 python3 -m http.server 放在D盾中检测 基本可以确认木马文件就是这四个 /var/www/html/shell.p…...

编程日记 2024/10/26 0:02:53

做资料网站违法/网站备案

lsof -i tcp:port eg: lsof -i tcp:8899 转载于:https://www.cnblogs.com/itdev/p/6379519.html...

编程日记 2024/11/26 4:10:22

模板网站不可以做seo优化吗/上海seo优化培训机构

回到系列文章的目录——[系列文章目录]　　回到本章目录——[第1章目录]1.2 让程序“跑”起来把程序写在纸上&#xff0c;有思考&#xff0c;有实践&#xff0c;这种方式可以有。　　把程序输入到计算机&#xff0c;让计算机“跑”程序&#xff0c;这种方式最直观。这也是让程序…...

编程日记 2024/11/26 2:30:35

html代码例子/乐天seo培训

java基础&#xff08;十一章&#xff09; 一、理解什么是类和对象 万事万物皆对象 1、属性——对象具有的特征&#xff08;特点&#xff09; 2、方法——对象可执行的操作&#xff08;能干什么事&#xff09; 3、对象的定义&#xff1a; 是一个客观存在的&#xff0c;看的见或摸…...

编程日记 2024/11/26 2:16:48

做网站要学些什么/宣传方式有哪些

今天需要将测试系统迁移到生产系统&#xff0c;于是在生产库中创建相应用户基表空间后&#xff0c;将测试系统的数据通过exp/imp(数据量不大)迁移到生产库上。通过windows下自带的ftp服务器上传到unix服务器上后&#xff0c;通过imp showy查看导入的内容以降低出错的概率&#…...

编程日记 2024/11/26 0:54:51

国内设计网站公司网站/上海百度seo牛巨微

TreeMap是jdk中基于红黑树的一种map实现。HashMap底层是使用链表法解决冲突的哈希表&#xff0c;LinkedHashMap继承自HashMap&#xff0c;内部同样也是使用链表法解决冲突的哈希表&#xff0c;但是额外添加了一个双向链表用于处理元素的插入顺序或访问访问。 既然TreeMap底层使…...

编程日记 2024/11/25 12:21:45

厦门微信商城网站建设/信息流推广渠道

“… fflush和fpurge将丢弃缓冲区中任何未写入或未读的数据……”&#xff1a;不.> fflush&#xff1a;The function fflush forces a write of all buffered data for the given output or update stream via the stream’s underlying write function. The open status of…...

编程日记 2024/11/25 12:12:40