ReactNative环境安装,超详细,搭建第一个RN_app

ReactNative环境安装,超详细。开发自已第一个AP

ReactNative环境安装,超详细。开发自已第一个APP.

许多人学习react-native放弃的很大一部分原因是一开始环境就让学习者头大,并不是语法或者组件上的问题。

安装java基本没什么问题,傻瓜式操作,下一步下一步。

安装java jdk和配置环境

安装java基本没什么问题,傻瓜式操作,下一步下一步。
1.修改环境变量,新增JAVA_HOME的系统环境变量,值为C:Program Files (x86)Javajdk1.8.0_121,也就是安装JDK的根目录(jdk安装环境)

2. 修改系统环境变量Path,在Path之后新增%JAVA_HOME%in;%JAVA_HOME%jrein;

  1. 新建系统环境变量CLASSPATH,值为.;%JAVA_HOME%libdt.jar;%JAVA_HOME%lib ools.jar

 4.保存所有的系统环境变量,同时退出系统环境变量配置窗口,然后运行cmd命令行工具,输入javac,如果能出现javac的命令选项,就表示配置成功!

 

安装Node.js环境

注意:需要安装最新的长期稳定版本,不要实验版本;安装完毕之后的node.js会自动配置到全局系统环境变量中
安装完毕后,可以输入node -v查看node版本号,版本最好安装高一点,8点几的版本可能会有问题。

 

安装Python环境

1.注意:安装Python时候,只能安装2.×的版本,注意勾选安装界面上的Add Python to path,这样才能自动将Python安装到系统环境变量中;

打开环境变量是否自身已经添加在这里插入图片描述
2.安装完毕之后,可以在命令行中运行python,检查是否成功安装了python。
在这里插入图片描述

配置安卓环境

配置安卓环境,踩坑最多的地方

  1. 安装installer_r24.3.4-windows.exe,最好手动选择安装到空余容量大于50G的盘符下
    在这里插入图片描述
  2. 下载,tools,build-tools,extras,platform,platform-tools
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
  3. 配置安装环境变量:在系统环境变量中新建ANDROID_HOME,值为android SDK Manager的安装路径G:Android,紧接着,在Path中新增;%ANDROID_HOME% ools;%ANDROID_HOME%platform-tools;
    在这里插入图片描述

ReactNative快速打包

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

npm安装:npm install -g yarn react-native-cli

  1. 在桌面新建文件,我这里命rn2,在rn2目录下运行react-native init hd2 创建React-Native项目
  2. 运行cd hd2切换到项目根目录中
    在这里插入图片描述
  3. 在项目hd2中 在android下新建local.properties文件,并写入sdk.dir=G:Android
    在这里插入图片描述
    在这里插入图片描述
    4 .在项目hd2中 运行 react-native start命令上,不要关闭。
    居中并且带尺寸的图片:
    5.打开安卓模拟器,我用的是夜神模拟器,打开后,在hd2下重新开一个powershell, 之前的powershell不要关闭。运行adb connect 127.0.0.1:62001,模拟器一定要开启。 运行命令react-native run-android打包的模拟器。62001是夜神模拟器默认端口。其他模拟器默认端口请自行百度。
    在这里插入图片描述
    在这里插入图片描述

在这里插入图片描述
大功告成了

注意事项

如果在运行命令react-native run-android时出现下面错误提示
error Failed to install the app. Please accept all necessary Android SDK licenses using Android SDK Manager: “$ANDROID_HOME/tools/bin/sdkmanager --licenses”. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081

操作:在安装Android sdk下的/tools/bin/目录下运行sdkmanager --update,一直点y接受 licenses就可以了

原文地址:https://www.cnblogs.com/songfengyang/p/14173866.html