2023-02-08 记录一下react-native app项目搭建过程

项目开发环境：windows 10

项目运行系统：Android

项目搭建前你得确保你有一个用于开发的IDE和已经安装好了的rn（react-native简称）脚手架，我是要用rn的脚手架来搭建项目的。

请分别执行以下代码：

react-natvie init myApp --version 0.68.2

这里用了指定版本（0.68.2）就是为了避免会出现rn版本不兼容问题而出现的bug。

如果你运行这行代码报错，那么请改运行下面代码：

npx react-native@latest init AwesomeProject

一路回车即可；

当你看到下面代码出现时，表示react-native的app包已经下好了：

Done in 44.10s.


  Run instructions for Android:
    • Have an Android emulator running (quickest way to get started), or a device connected.
    • cd "D:\myApp" && npx react-native run-android

  Run instructions for Windows:
    • See https://aka.ms/ReactNativeGuideWindows for the latest up-to-date instructions.

如图示：

接着下一步就是用数据线把你的手机和电脑连接起来，然后执行下面代码：

adb devices

这个是用于检测电脑有没有识别到你的手机，如果出现下面代码中有device则证明你的设备已经进来了，可以为安装android包到你手机上而作准备

List of devices attached
N2XNW21225007660        device

如果adb报错：

如果你没有把react-native app项目导入到android studio，那么可能是因为没有安装到adb.exe；

如果已经导入了android studio并且已经安装了adb.exe，那就可能要手动配置adb的环境变量，请看这：https://www.cnblogs.com/iuniko/p/17816395.html

如果adb没报错，请接着阅读下文👇

你要确保你已经打开设备的 USB 调试开关，接着初始化项目依赖

yarn android

初始化完成后，它会弹出一个项目运行的窗口，然后它还会自动打包到你手机上。

这个过程耗时比较长，我用了20分钟才打包成功，而且是没用到Android studio这种打包工具，仅用vscode就搞定了。

更多安装细节可以参考rn的官网https://reactnative.cn/docs/environment-setup

============================  报错指引  start  ============================

2023-03-01 报错指引：'react-native' 不是内部或外部命令，也不是可运行的程序

这个报错是因为你没有全局安装react-native的脚手架，请执行下面代码全局安装react-native脚手架👇

注意：如果你已经全局安装了，并且在npm文件夹里有react-native-cli这个文件夹存在，那么多半是因为电脑没有识别到脚手架的问题，你只需要重启一下电脑可解决。

npm install -g react-native-cli

============================  报错指引  end  ============================