一、React Native概述
React是一个构建用户界面的JS框架,实现了数据的响应式和组件化开发,本身既可以用于Web网站项目,也可以用于创建移动端App项目。
相较于Vue.js在移动端只能构建WebApp,React生态系统中有一个可以构建“真正原生App”的扩展 —— React Native,可以这样说:“React Native是React生态圈可以傲视其它对手的绝对功臣”。
原理:React Native应用中的JS代码,在开发运行阶段会被编译为原生的Java或OC代码
React Native英文官网:https://reactnative.dev/
React Native中文网:https://www.react-native.cn/
二、React Native开发/运行环境搭建
开发平台:Windows
目标平台:Android
1.安装依赖
必须安装的依赖有:Node、JDK 和 Android Studio。
1.1安装Nodejs(版本大于V14)
下载地址:https://nodejs.org/en/download/
查看版本:node -v
1.2安装JDK(版本大于V11)
下载地址:https://www.oracle.com/java/technologies/downloads/#java11(下载需注册登录)
备用地址: https://423down.lanzouo.com/iFuI6yyvnyb
安装步骤如下:
1.下载完成打开安装包
2.修改安装路径,默认路径也可以
3.开始漫长的安装
4.安装完成,点击关闭即可
查看版本:javac -version
1.3安装Android Studio(原生Android开发必备工具)
下载地址:https://developer.android.google.cn/studio/
安装步骤:
1.打开下载好的安装包
2.点击Next
3.修改安装路径,默认也可,然后Next
4.正在安装,完成后点击Next下一步后点击Finish
5.完成后运行界面,点击Next
6.安装界面中选择"Custom"选项
7.勾选同意(Accept)所有的使用条款即可。接下来开始下载将近400MB的资料
7.内存的选择,根据情况选择就好,最好不要低于2G(2048MB)
8.然后就是next-finish完成下一步就好,在 SDK Manager 中选择"SDK Platforms"选项卡,
然后在右下角勾选"Show Package Details"。展开Android 11 ®选项,确保勾选了下面这些组件:
- Android SDK Platform 30
- Intel x86 Atom_64 System Image
然后点击"SDK Tools"选项卡,同样勾中右下角的"Show Package Details"。展开"Android SDK Build-Tools"选项,确保选中了 React Native 所必须的30.0.2版本。你可以同时安装多个其他版本
然后还是在"SDK Tools"选项卡,点击"NDK (Side by side)“,同样勾中右下角的"Show Package Details”,选择20.1.5948944版本进行安装。
最后点击"Apply"来下载和安装这些组件。
2.配置ANDROID_SDK环境变量
WIN7:计算机→属性→高级系统设置→高级→环境变量;
WIN10:此电脑→高级系统设置→环境变量。
或者直接搜索环境变量打开。
1.新建,创建一个名为ANDROID_SDK的环境变量,变量值需要填写自己安装的路径
2.修改系统环境变量Path,编辑path环境变量,添加一个%ANDROID_SDK%;
点击确定,确定,确定。所有的确定都要点才会保存好配置。然后重启Android Studio。
系统环境变量Path,编辑path环境变量,添加一个%ANDROID_SDK%;
点击确定,确定,确定。所有的确定都要点才会保存好配置。然后重启Android Studio。