React Native 环境搭建

搭建开发环境

在React Native官网 https://reactnative.cn/docs/environment-setup 网址上有两种环境,一种完整原生环境,所谓原生环境, RN之所以能够跨平台,包含一个Android项目,IOS项目和一个JS项目,就应该开发在对应的项目环境中。而另一种简易沙盒环境是有开发者认为多环境开发过于麻烦,所以提供了一个命令行的工具,用这个环境所对应的RN项目只包含JS的项目,之后扫描该环境内部的二维码,就可以显示平台对应内部的原生端平台的项目,另外该环境提供了很多的原生API,比如摄像头,数据库之类的,甚至提供在线打包的功能,将代码提交到云端,在远程打包后再下载下来,但是由于打包是封装了一层,所以想使用原生的一些API支持就不能做到,比如需要开发蓝牙功能,而简易沙盒环境没办法提供这类支持。综上所述,还是使用完整原生环境会相对来说比较好些。

Node环境搭建

Mac OS用户可以通过HomeBrew的下载方式下载brew, 之后下载node和watchman:
1.brew install node
2.brew install watchman
Node安装完成的同时,也同时安装了npx的node包管理工具,与brew作为mac OS系统软件的管理工具类似。

# 使用nrm工具切换淘宝源(npx当前本地包管理地址没有,去官方源下载nrm,nrm专门管理Node包管理镜像)
npx nrm use taobao

# 如果之后需要切换回官方源可使用
npx nrm use npm

Android 开发环境

1.首先需要下载java JDK1.8的环境(JDK1.8下载、安装和环境配置教程)
2.下载Android Studio,官网地址 安装完成后打开Android Studio,右下角选择Configure的SDK Manager。
3. 下载对应的Android SDK版本,勾选 SDK Platforms选择Show Packages Detail再选择Android Studio Platform 28和Google APIs Intel x86 Atom System Image, SDK Tools选择Show Packages Detail再选择28.0.3
4. 把一些工具目录添加到环境变量 Path
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量,选中Path变量,然后点击编辑。点击新建然后把这些工具目录路径添加进去:platform-tools、emulator、tools、tools/bin
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\emulator
%ANDROID_HOME%\tools
%ANDROID_HOME%\tools\bin
5. Tools -> Device Manager 中下载 AVD 安卓模拟屏幕已验证React Native项目在Android运行的情况

React Native命令行工具使用

Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务等任务。

npm install -g yarn react-native-cli
npx react-native init AwesomeProject(自己的项目名称)

注意: 尽可能使用node 14.17.0以上的版本进行安装和创建项目
如果使用当中有什么问题,可以将 React Native开发错误警告处理总结一文作为参考

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
React Native 是一个基于 React 的框架,可以用于构建原生应用程序。在开始 React Native 开发之前,需要先搭建相应的开发环境。下面是 React Native 环境搭建的步骤: 1. 安装 Node.js 和 npm React Native 使用 Node.js 和 npm 进行构建和管理依赖。可以从 Node.js 官网下载对应平台的安装包,安装完成后,npm 就会随之安装。 2. 安装 React Native 命令行工具 打开终端或命令行窗口,运行以下命令: ``` npm install -g react-native-cli ``` 这个命令会全局安装 React Native 命令行工具。 3. 安装 Android Studio(仅适用于 Android 平台开发) 如果要进行 Android 平台开发,需要安装 Android Studio。可以从 Android Studio 官网下载对应平台的安装包,安装完成后,启动 Android Studio,并安装相应的 SDK 和 Android 虚拟设备(AVD)。 4. 配置 Android 环境变量(仅适用于 Windows 平台开发) 在 Windows 平台上进行 Android 开发时,需要配置相应的环境变量。可以在系统的“环境变量”中添加以下两个变量: - ANDROID_HOME:指向安装的 Android SDK 的路径 - PATH:在原有的 PATH 变量值后面添加 Android SDK 的 tools 和 platform-tools 目录的路径 5. 创建新项目 在终端或命令行窗口中,进入到要创建项目的目录,运行以下命令: ``` react-native init MyProject ``` 这个命令会创建一个名为 MyProject 的项目,其中包含了 React Native 的基本文件。 6. 运行项目 进入到项目的根目录,运行以下命令: ``` react-native run-android ``` 这个命令会启动 Android 模拟器,并在模拟器上运行项目。如果要在真机上运行项目,需要先将手机连接到电脑,并按照官方文档的说明进行配置。 以上就是 React Native 环境搭建的步骤,希望对你有所帮助。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值