reactnative环境搭建-windows

一、安装依赖

1、Node（以下为两种安装方式，1为基本安装，2为通过管理工具安装）

1，按照教程步骤安装指定版本的node（Node.js 安装配置），注意 Node 的版本应大于等于 14。默认安装在C盘，如果自定义安装了其他盘需要配置环境变量（我的电脑右键→属性→高级系统设置→环境变量→系统环境变量→打开Path）：

2，安装版本管理工具（nodejs在windows下的安装配置(使用NVM的方式)），方便多版本node管理。

2、JDK（Java Development Kit [JDK] 11）

点击链接下载jdk，注意高版本reactnative需要下载jdk11，不要下载错了。

按照教程安装jdk11（JDK11 下载与安装、环境配置）。

安装完成后需要配置环境变量JAVA_HOME和%JAVA_HOME%\bin：

二、安装Android Studio

1，按照教程安装Android studio（Android Studio 2022.3 新版 flamingo 安装步骤及遇到的问题、超全Android Studio 安装和调整教程）

2、安装 Android SDK，按照react native官方文档要求的sdk安装。

这里如果网不好的话，可以参考上一条调整教程设置代理：mirrors.neusoft.edu.cn:80

3、配置 ANDROID_HOME 环境变量

参考官方文档配置：

4、增加 GRADLE_USER_HOME 和ANDROID_SDK_HOME 路径

修改这两个路径可以分别使默认下载在C盘的gradle和avd模拟器安装到指定的路径下：

1.未修改时路径位置为：C:\Users\Administrator\.gradle和 C:\Users\Administrator\.android

2、修改为自定义路径：

三、项目测试

参照官方文档创建项目，用Android studio打开android项目，等待gradle运行。如果gradle下载失败可以切换阿里镜像源：

// 添加阿里云 maven 地址
//        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
//        maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven {
            url 'https://maven.aliyun.com/repository/central'
            name 'central'
        }

 或者参考2-1的调整教程设置grdle国内下载镜像：https\://mirrors.cloud.tencent.com/gradle/gradle-8.0-bin.zip

四，npm和yarn更改依赖包全局下载和缓存路径

以下配置为节省C盘空间配置，参考：npm和yarn更改依赖包全局下载和缓存路径

1、在 D盘新建一个目录，用来存放 npm 或 yarn 的 cache 和 依赖包文件

我这里新建的文件夹如下：

F:\Software\RN\node_package\npm

F:\Software\RN\node_package\npm_cache

F:\Software\RN\node_package\yarn

F:\Software\RN\node_package\yarn_cache

2、更改npm  和 yarn  的配置

# npm
npm config set prefix "F:\Software\RN\node_package\npm"
npm config set cache "F:\Software\RN\node_package\npm_cache"

# yarn
yarn config set global-folder "F:\Software\RN\node_package\yarn"
yarn config set cache-folder "F:\Software\RN\node_package\yarn_cache"

3、查看配置

# npm 
npm config list

# yarn
yarn config list

4、为了让安装的包，能在控制台使用，需要配置 Path 环境变量

在系统变量中新建
NODE_HOME F:\Software\RN\node_package

Path中添加路径
%NODE_HOME%\npm
%NODE_HOME%\yarn\node_modules.bin

检查当前yarn 的 bin的 位置

yarn global bin

检查当前 yarn 的 全局安装位置

yarn global dir

检查当前 yarn 的 缓存位置

yarn cache dir

以上配置完成可以将C盘中的缓存文件移动，以节省C盘空间。