[react-native-0.71.x] 开发环境搭建与基础配置(android)

1,212 阅读1分钟

关于React Native CLI脚手架项目配置

版本说明: react-native: 0.71.8 、JDK版本: jdk-11

由于项目需要加载一些依赖包,并且是从国外的服务器下载,下载速度会很慢(当然,如果流量够用,可以尝试连接手机热点,这样下载速度会有所提升),所以很多时候会下载超时,以致于项目跑不起来。这时候我们可以对项目进行修改。无非就是更改为国内的源。

使用React Native CLI提供的脚手架项目

$ npx react-native@latest init MyApp

首先修改android/gradle/wrapper/gradle-wrapper.properties文件

distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
# 默认
# distributionUrl=https\://services.gradle.org/distributions/gradle-7.5.1-all.zip
# 腾讯源
distributionUrl=https\://mirrors.cloud.tencent.com/gradle/gradle-7.5.1-all.zip
# 本地源
# distributionUrl=file\:///D:/google/gradle-7.5.1-all.zip
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists

然后是android/build.gradle文件

buildscript {
    ext {
        buildToolsVersion = "33.0.0"
        minSdkVersion = 21
        compileSdkVersion = 33
        targetSdkVersion = 33

        // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
        ndkVersion = "23.1.7779620"
    }
    repositories {
        // NOTE: 记得注释下面两行
        // google()
        // mavenCentral()

        /* NOTE: 设置国内阿里云Maven仓库镜像
         * 有时候会涉及到某个包在下面的某个仓库下找不到的情况。
         * 这时候,可以去阿里云仓库上面搜索查找是否包含该包,
         * 或者查看该包位于哪个仓库下,然后对以下源的加载顺序进行调整
         */
        maven { url 'https://maven.aliyun.com/repository/google' } // 放第1个
        maven { url 'https://maven.aliyun.com/repository/gradle-plugin' } // 放第2个
        maven { url 'https://maven.aliyun.com/repository/central'} // 放第3个
        maven { url 'https://maven.aliyun.com/repository/jcenter'} // 放第4个
        maven { url 'https://maven.aliyun.com/repository/public' } // 放第5个
    }
    dependencies {
        classpath("com.android.tools.build:gradle:7.3.1")
        classpath("com.facebook.react:react-native-gradle-plugin")
    }
}

// NOTE: 所有项目设置国内阿里云Maven仓库镜像, 貌似不起作用
// NOTE: 因为即使设置了,node_modules/react-native-gradle-plugin中的build.gradle.kts与settings.gradle.kts还是需要配置镜像
allprojects {
    repositories {
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }
        maven { url 'https://maven.aliyun.com/repository/central'}
        maven { url 'https://maven.aliyun.com/repository/jcenter'}
        maven { url 'https://maven.aliyun.com/repository/public' }
    }
}

android目录下新建local.properties文件,若是在Android Studio中打开项目根目录下的android目录, 则会自动生成该文件

# NOTE: 根据电脑所在的sdk路径自行配置
sdk.dir=E\:\\AndroidSDK

接着,找到node_modules/react-native-gradle-plugin/build.gradle.ktsnode_modules/react-native-gradle-plugin/settings.gradle.kts文件,分别进行如下设置:

build.gradle.kts文件

/* 此处省略部分内容 */

repositories {
  // NOTE: 注释该部分内容 
  // google()
  // mavenCentral()

  maven {
    setUrl("https://maven.aliyun.com/repository/central")
  }
  maven {
    setUrl("https://maven.aliyun.com/repository/google")
  }
  maven {
    setUrl("https://maven.aliyun.com/repository/gradle-plugin")
  }
  maven("https://maven.aliyun.com/repository/jcenter")
  maven {
    setUrl("https://maven.aliyun.com/repository/public")
  }
}

/* 此处省略部分内容 */

settings.gradle.kts文件

pluginManagement {
  repositories {
    // NOTE: 注释该部分内容 
    // mavenCentral() -> 对应https://maven.aliyun.com/repository/central
    // google() -> 对应https://maven.aliyun.com/repository/google
    // gradlePluginPortal() -> https://maven.aliyun.com/repository/gradle-plugin

    // NOTE: 设置国内阿里云Maven仓库镜像
    maven {
      setUrl("https://maven.aliyun.com/repository/central")
    }
    maven {
      setUrl("https://maven.aliyun.com/repository/google")
    }
    maven {
      setUrl("https://maven.aliyun.com/repository/gradle-plugin")
    }
    // NOTE: 简写
    maven("https://maven.aliyun.com/repository/jcenter")
    maven {
      setUrl("https://maven.aliyun.com/repository/public")
    }
  }
}

/* 此处省略部分内容 */

另外,需要注意的是,windows下,gradle默认下载地址存放在${USER_HOME}/.gradle/目录(即: C:\Users\用户名\.gradle)下。

依赖包我们可以在C:\Users\用户名\.gradle\caches\modules-2\files-2.1中找到。

如果需要更改,可以配置系统环境变量。见下图:

image.png

这里的GRADLE_USER_HOME用来自定义gradel存储路径用的

当然,也可以在自定义的路径下,新建D:\gradle_repo\.gradle\init.gradle文件,全局配置Gradle国内镜像。具体操作内容,可以自行搜索一下。

相关链接:

各版本gradle下载: mirrors.cloud.tencent.com/gradle

国内阿里云镜像: developer.aliyun.com/mvn/view