ReactNative学习(1)

type

status

date

slug

summary

环境部署

官方地址

首先要提供的两个地址

react native的官网

Get Started with React Native · React Native

React Native allows developers who know React to create native apps. At the same time, native developers can use React Native to gain parity between native platforms by writing common features once.

https://reactnative.dev/docs/environment-setup

Android Studio的下载地址

下载 Android Studio 和应用工具 - Android 开发者 | Android Developers

Android Studio 提供了一些应用构建器以及一个已针对 Android 应用进行优化的集成式开发环境 (IDE)。立即下载 Android Studio。

https://developer.android.google.cn/studio?hl=zh-cn

因为我没有mac/iphone/Apple开发者账号，所以直接进行Android项目的开发。

环境部署

安装相关SDK

我们需要安装node18、jdk17、以及安卓的开发环境

我这里使用的是scoop 一个包管理工具，地址在下面，如果想通过scoop安装jdk，可能需要配置一下仓库，默认仓库里的东西已经挺多的，但是我们需要一个专门下载jdk的仓库，使用scoop bucket add java 命令，添加Java的仓库

scoop.sh

A command-line installer for Windows

https://scoop.sh/

node的管理工具是nvm （前端开发，懂得都懂得）

这里使用scoop 下载了openjdk17

andriod环境

下载好andriod studio ,按照步骤一步一步装（官方都有的）

然后具体步骤看官方文档，你需要设置环境变量等等

Set Up Your Environment · React Native

In this guide, you'll learn how to set up your environment, so that you can run your project with Android Studio and Xcode. This will allow you to develop with Android emulators and iOS simulators, build your app locally, and more.

https://reactnative.dev/docs/set-up-your-environment

💡

这里我要说一点的就是，如果你在国内，你要下载sdk，一定要有一个稳定的梯子，如果没有稳定的梯子，可能就会报错了。

如何在电脑上查看模拟的数据

按照官网文档的创建好项目以后

💡

中文官网和英文官网使用的方式不一样，我这里从头开始选用英文官网的expo

命令行：npx create-expo-app@latest

2.创建好项目以后，我们直接进入项目，然后输入命令

💡

注意，不要输入npm run android ，否则会出现如下报错

因为他们使用的expo这个方法，所以，我们可以直接运行npx expo start,就可以直接实现扫码调试了，因为使用的是expo，所以我们是可以直接在浏览器里面调试，直到你需要调试一些本地参数

💡

留坑：这里我npx expo run一直启动不起来，报错也是积极拒绝，后续看看怎么解决

到此，我们的项目就算是安装完成了，后面我要搞的是路由：React Navigation

之前没有用expo的时候是有一个坑的，也就是我按照中文文档创建好项目以后，如果我要调试我的项目，我需要图上的位置把东西加上，很重要，要不然会跑不起来

环境部署

官方地址

环境部署

安装相关SDK

如何在电脑上查看模拟的数据

风潮退却，你真的需要本地部署吗

面试题分享