windows下react-native 开发环境搭建

1、react-native安装

 npm install -g react-native-cli 

可以使用yarn代替npm,安装更快

yarn global add react-native-cli

校验是否安装成功

 react-native -v 

2、使用脚手架初始化项目

react-native init MyProject

时间比较长,可以多尝试几次

3、安卓虚拟机安装,并启动前

建议使用genymotion安卓模拟器(有真机的情况,使用真机)

4、运行项目

项目运行前,必须启动

cd MyProject
npm install 或 yarn
启动react-native服务
react-native start
在模拟器中运行
react-native run-android

第一次使用虚拟机运行时,会发生如下报错:

解决方式(为设备配置Debug server host & port)
Ctrl+M(或点击摇一摇)打开配置页面

配置完毕。点击R+R,reload页面(出现白屏时,构建静态资源目录)

使用VS Code + react-devtools + genymotion搭建开发环境

(推荐使用VS Code进行开发,Android Studio进行APK打包)

1、VS Code、react-devtools、genymotion搭建开发环境下载安装(略)

react-devtools安装方式
npm install react-devtools -g

2、VS Code RN 开发环境搭建

VS Code安装 React Native Tools(演示)

Debug Andriod调式器搭建

配置完成,点击启动debug调式模式
配置页面启动页更新

3、react-devtools进行页面样式调式


总结

1、开发环境:

推荐使用VS Code(代码开发、调式) + react-devtools(页面样式调式) + genymotion(安卓虚拟机);

2、打包apk:

推荐使用 Android Studio;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容