RN学习笔记

一、安装依赖

        1、需要安装 node,Python,JDK
        直接下载 .msi 文件(安装包)自动开始安装,我是把后 2 个直接装到 C 盘,后面发现并没有关于这 2 个的环境变量的路径配置,node安装好后直接按照 RN官网 流程配置命令行工具。

        2、配置命令行工具:
        npm i -g react-native-cli    安装 react-native 脚手架(这一步使用 yarn install -g  react-native-cli ,是没成功的,暂不清楚原因),如下显示是成功的结果。
    RN学习笔记_第1张图片

二、搭建 Android 开发环境

    1、下载 Android Studio (这是中文社区连接,下文简称 AS),并安装。

    2、通过 AS 下载 Android SDK,然后配置环境变量,按照官网的流程走就行
        (该 SDK 下载完成后可以不用 AS 开发,我只是用 AS 来下载所需的 SDK 的,配置好环境变量后就能使用到那些 SDK 了,开发使用的是 VS code)。   

    3、创建新项目    react-native init myApp    创建一个项目名为 myApp 的项目,此时在该目录下有如下文件
    RN学习笔记_第2张图片

三、准备 Android 设备,我使用的是安卓真机,自己的手机 OPPO Find X

    有 2 中调试方式:1.使用 USB 连接;2.使用 WiFi 连接。

    因为官方教程是使用的 USB 连接到电脑,所以我先用数据线连接手机和电脑,按照官方教程在手机上进行了操作,然后进行第四步,中间有些曲折,但是成功了。

    使用 WiFi:我是根据这篇博客上的说明做的,中间还是有点曲折,跟文中似乎有点不完全一样,但是最后还是成功了。
    注:该博客最后说的连接电脑的 IP 地址和端口号,端口号就是 8081 就可以。

四、真机同步,编译并运行 React Native 应用

    cd 项目名
    react-native run-android

最后附上一张我通过 WiFi 真机同步所看到的界面

RN学习笔记_第3张图片

五、期间遇到的报错

    1、adb.exe: unknown command advices
        这是在使用命令 adb devices 查看电脑所连接的设备时报的错,解决方法见此博客,以下是我成功解决该问题的截图

RN学习笔记_第4张图片

    2、红屏报错,解决方法:见此博客

RN学习笔记_第5张图片

    3、红屏报错如下,解决方法:见此博客

RN学习笔记_第6张图片

六、在虚拟器上调试

    1、[React Native] VS Code 调用模拟器(虚拟机/仿真器)开发调试

 

你可能感兴趣的:(react,native,RN,移动开发--RN)