React Native安卓项目初始化

配置Node、安卓开发环境

这里不赘述，可以根据官网，根据自己的开发设备环境进行配置。

搭建开发环境 · React Native 中文网

将恼人的.android文件夹移出c盘

我的c盘空间真的时捉襟见肘了，然而android studio avd虚拟设备的安装地址.android竟然在c盘，这里可以把它迁移出去，c盘很大的可以跳过这一步。

1、配置环境变量

在系统环境变量中新增ANDROID_SDK_HOME 变量，地址为你想要将.android放入的文件夹内，例如我的地址就是D:\ANDROID_SDK_HOME 。

（PS：配置完成后，需要重启电脑才能生效哦）

2、剪切.android文件

直接将c盘用户目录下的.android文件夹，剪切到之前配置的ANDROID_SDK_HOME 地址下，我粘贴到了D:\ANDROID_SDK_HOME 文件夹下。

3、修改AVD配置文件

找到.android\avd 下后缀为.ini的文件，编辑文本打开，修改path为当前的avd文件夹所在路径。

4、重启android studio

重启完成后，能正常打开avd就成功啦。

初始化项目

初始化一个名为AwesomeProject的项目

bash 复制代码

npx react-native@latest init AwesomeProject

安卓build.gradle配置

为了保证运行时下载资源包顺利，找到android\build.gradle 文件，修改repositories 为如下：

Groovy 复制代码

repositories {
        maven { url '<https://maven.aliyun.com/repository/google>' }
        maven { url '<https://maven.aliyun.com/repository/jcenter>' }
}

然后将sdkVersion修改成你需要的版本，示例如下：

Groovy 复制代码

ext {
        buildToolsVersion = "31.0.0"
        minSdkVersion = 21
        compileSdkVersion = 31
        targetSdkVersion = 31

        // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
        ndkVersion = "23.1.7779620"
}

运行项目

bash 复制代码

npm run android

即可运行起来初始好的项目。

调试相关

下载react-native-debugger ，github地址。

路由

一个很重要的插件 react-navigation ，详情看文档。

使用Redux

引用了@reduxjs/toolkit、react-redux

参考资料：redux-toolkit.js.org/tutorials/q...

使用样式类或者预编译器

直接使用Stylesheet吧，不推荐用预编译器。

适配DarkMode

使用react-native-dark-mode插件。

具体怎么引用这里不再说明，看文档一步一步来就问题不大。

列举几个常用的写法。

useDarkMode：Boolean，判断深色模式是否开启。
useDarkModeContext：返回dark或者light，也是用于判断深色模式是否开启的。
DynamicStyleSheet, DynamicValue and useDynamicStyleSheet，创建style的时候使用DynamicStyleSheet，在style中可以使用DynamicValue实现css动态变化，最后在函数中使用useDynamicStyleSheet。

更多用法还是详见文档。

如何发送网络请求

官方提供了访问网络的方法，不过要注意ios和android现在都会组织http请求，具体解决方案可参考iOS、Android

或者可以使用我们最熟悉的axios。

结语

到此，一个最基础的react native的开发框架就搭建起来啦，下面就可以进行业务开发啦。