react-native初始化App，给前端开发工程师的加薪之路！面试加分

昨天更新的环境配置文章很多同学都收藏了，希望大家能够在评论区写下你们的看法，跟大家一起交流，分享心得。

react-native开发环境准备好之后，今天就分享如何初始化一个App，然后运行在模拟器上调试开发！

老规矩，首先大体梳理下流程，这是一个开发的好习惯，在开发的过程中我们先不要急着动手写代码，先梳理下思路，把思路理清楚了，开发起来就轻松很多。

1. 到npm安装react-native的全局指令环境

2. 运行初始化App命令

3. 打开下载好的模拟器

4. 运行链接模拟器命令

5. 启动项目

6. 查询本机IP地址

7. 打开模拟器调试模式浮窗

8. 设置App运行端口

9. 开发调试

这样把流程先给大家列出来，然后我们在一步步来实现就有条理性！

第一步：全局安装react-native-cli

找到你之前下载的node安装目录，运行命令 npm install react-native-cli -g （其他盘符文件内也可以）

接着随便新建一个放App的文件夹目录，进入文件夹运行初始化App命令 react-native init ReactNativeApp(项目名称)

运行完成后可以看到项目目录结构

接着在当前目录下运行链接模拟器命令 adb connect 127.0.0.1:62001

提示链接成功

链接成功后，运行启动项目命令 react-native run-android 运行后等待数分钟，模拟器会自动安装debug版本的App，成功后见以下截图

继续，查询本机IP，运行命令 ipconfig

然后找到模拟器的抖动弹出浮窗按钮，在模拟器的右上角

点击弹出下面的截图，进入Dev setting

点击进入，将查询到的IP地址加上8081端口确认即可。

这里提醒大家一下，刚开始经常犯的错误，端口前面的冒号打成了中文模式的，一直调试不到，所以大家一定记得是切换中英文状态。这样确定之后回到设置Dev setting的弹窗，每次写了代码直接选择第一项reload一下，就会编译成功，达到在线调试的效果。当然也可以设置成自动刷新，不过本人不建议，因为速度太慢了，还是手动来的快！

那么到这里，初始化App就完成了，就可以开始写代买了！

程序员从来就不是一个人在的工作，它需要分享与交流，感谢大家看到这里，老板肯定给你加薪！