React-Native 开发环境搭建

开发环境初始化
官方文档: ​​​https://reactnative.dev/docs/environment-setup​

一、安装 AndroidStudio,安装 JDK, Android SDK

新建一个 ADV Android 模拟机,启动它

React-Native 开发环境搭建_react.js

二、设置 path

添加 ​​ANDROID_HOME = F:\Android\​​​ 给 Path 添加 ​​F:\Android\platform-tools​

三、新建一个 React Native 项目

1. 新建一个 DemoApk 项目

npx react-native init DemoApk

2. 启动 Metro

npx react-native start

React-Native 开发环境搭建_react native_02

3. 启动程序

npx react-native run-android

4. 在每次修改页面内容后,按 r 键即可更新模拟器中的页面内容

React-Native 开发环境搭建_初始化_03
React-Native 开发环境搭建_react native_04

React-Native 开发环境搭建_react native_05

调试信息的展示

所有的控制台信息都会发送到 ​​npm run start​​ 的窗口中

React-Native 开发环境搭建_android_06