记录我第一次配置Android和react-native踩过的坑

发表于 更新于 分类于 ， 阅读次数： 本文字数： 6k 阅读时长 ≈ 5 分钟
第一次配置Android和react-native，搞了一个晚上，记录一下遇到的问题和踩过的坑...这一天天的，真TM累

前面全部按照React-Native中文版文档来，这没啥问题

先启动AVD,顺序别搞错了

使用 npm 运行 React Native 项目

1
npm run android

遇到如下问题

1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
info Installing the app...
Downloading https://services.gradle.org/distributions/gradle-8.10.2-all.zip 


info 💡 Tip: Make sure that you have set up your development environment correctly, by running npx react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor 

Exception in thread "main" java.io.IOException: Downloading from https://services.gradle.org/distributions/gradle-8.10.2-all.zip  failed: timeout (10000ms)
        at org.gradle.wrapper.Install.forceFetch(SourceFile:4)
        at org.gradle.wrapper.Install$1.call(SourceFile:8)
        at org.gradle.wrapper.GradleWrapperMain.main(SourceFile:67)
Caused by: java.net.SocketTimeoutException: Connect timed out
        at java.base/sun.nio.ch.NioSocketImpl.timedFinishConnect(NioSocketImpl.java:546)
        at java.base/sun.nio.ch.NioSocketImpl.connect(NioSocketImpl.java:597)
        at java.base/java.net.SocksSocketImpl.connect(SocksSocketImpl.java:327)
        at java.base/java.net.Socket.connect(Socket.java:633)
        at java.base/sun.security.ssl.SSLSocketImpl.connect(SSLSocketImpl.java:299)
        at java.base/sun.net.NetworkClient.doConnect(NetworkClient.java:178)
        at java.base/sun.net.www.http.HttpClient.openServer(HttpClient.java:498)
        at java.base/sun.net.www.http.HttpClient.openServer(HttpClient.java:603)
        at java.base/sun.net.www.protocol.https.HttpsClient.<init>(HttpsClient.java:266)
        at java.base/sun.net.www.protocol.https.HttpsClient.New(HttpsClient.java:380)
        at java.base/sun.net.www.protocol.https.AbstractDelegateHttpsURLConnection.getNewHttpClient(AbstractDelegateHttpsURLConnection.java:189)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.plainConnect0(HttpURLConnection.java:1242)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.plainConnect(HttpURLConnection.java:1128)
        at java.base/sun.net.www.protocol.https.AbstractDelegateHttpsURLConnection.connect(AbstractDelegateHttpsURLConnection.java:175)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.followRedirect0(HttpURLConnection.java:2887)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.followRedirect(HttpURLConnection.java:2796)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.getInputStream0(HttpURLConnection.java:1927)
        at java.base/sun.net.www.protocol.http.HttpURLConnection.getInputStream(HttpURLConnection.java:1589)
        at java.base/sun.net.www.protocol.https.HttpsURLConnectionImpl.getInputStream(HttpsURLConnectionImpl.java:224)
        at org.gradle.wrapper.Install.forceFetch(SourceFile:2)
        ... 2 more

我不知道啊，报错说是在尝试下载 Gradle 8.10.2 版本时出现了超时问题，于是打开搜索引擎。。。

上面说把gradle-wrapper.properties这个文件内容改成如下内容

1
2
3
4
5
6
7
8
9
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://mirrors.cloud.tencent.com/gradle/gradle-8.10.2-all.zip
networkTimeout=10000
validateDistributionUrl=true
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists

//我看的大概意思是换源，第三行改成你自己的gradle的版本号，这行字删掉

2.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
Starting a Gradle Daemon (subsequent builds will be faster)

info 💡 Tip: Make sure that you have set up your development environment correctly, by running npx react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor 


FAILURE: Build failed with an exception.

* Where:
Settings file 'D:\EduLibrary\OurEDA\ReactNativeApp\android\settings.gradle' line: 2

* What went wrong:
Error resolving plugin [id: 'com.facebook.react.settings']
> java.io.UncheckedIOException: Could not move temporary workspace (D:\EduLibrary\OurEDA\ReactNativeApp\android\.gradle\8.6\dependencies-accessors\569c8b261a8a714d7731d5f568e0e5c05babae10-8ac2f4cd-268f-435d-94f6-418a4ae4fc61) to immutable location (D:\EduLibrary\OurEDA\ReactNativeApp\android\.gradle\8.6\dependencies-accessors\569c8b261a8a714d7731d5f568e0e5c05babae10)

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
> Get more help at https://help.gradle.org. 

BUILD FAILED in 1m 18s
info Run CLI with --verbose flag for more details.

我不知道啊，报错说是在构建 React Native 项目时，Gradle 遇到了一个异常，导致构建失败。具体来说，错误发生在 settings.gradle 文件的第 2 行，涉及到一个插件解析问题。于是打开搜索引擎。。。但没什么发现。。。nm

打开这个什么文件的第2行。。？facebook？。。OK，打开梯子，下载完成。。。nm

3

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
info 💡 Tip: Make sure that you have set up your development environment correctly, by running npx react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor 


FAILURE: Build failed with an exception.

* What went wrong:
A problem occurred configuring project ':app'.
> com.android.builder.sdk.InstallFailedException: Failed to install the following SDK components:
      ndk;26.1.10909125 NDK (Side by side) 26.1.10909125
  Install the missing components using the SDK manager in Android Studio.


* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
> Get more help at https://help.gradle.org. 

BUILD FAILED in 7m 47s
error Failed to install the app. Command failed with exit code 1: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081 FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':app'. > com.android.builder.sdk.InstallFailedException: Failed to install the following SDK components: ndk;26.1.10909125 NDK (Side by side) 26.1.10909125 Install the missing components using the SDK manager in Android Studio. * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. > Get more help at https://help.gradle.org.  BUILD FAILED in 7m 47s.
info Run CLI with --verbose flag for more details.
PS D:\EduLibrary\OurEDA\ReactNativeApp>

我不知道啊，报错说是在构建 React Native 项目时，Gradle 遇到了一个异常，导致构建失败。具体来说，错误信息指出项目 :app 在配置过程中遇到了问题，原因是缺少必要的 SDK 组件(ndk;26.1.10909125组件，这是啥我不知道，下呗)。。。

  • 在 SDK 管理器中，切换到 SDK Tools 选项卡。
  • 勾选 NDK (Side by side)，并确保版本 26.1.10909125 被选中。
  • 点击 OK 按钮，开始安装缺失的组件。

梯子保持打开不要动，慢慢等进度条跑到100%，然后发现可以热处理了，成功了！兄弟们NB啊哈哈哈哈！第一次构建会很慢，后来就快多了,666。