React Native 项目的搭建

 

    在上一篇博客中我有和大家分享项目环境的配置，今天会给大家分享一下如何搭建一个项目，并让它在夜神模拟器中成功跑起来，分享的比较直接，只要按命令来，项目是可以跑起来的哦，希望初学者可以认真按照步骤来搭建项目~~~

	1. 全局安装react-native的脚手架 
		npm install -g yarn react-native-cli
	2. 使用脚手架初始化react-native项目
		react-native init 项目名  
		例如 react-native init reactNativeApp
	3. 分析react-native项目目录结构
	4. 把项目运行到模拟器中
		1. 连接上模拟器 （注意模拟器要启动）
			adb connect 127.0.0.1:62001
		2. 提示 successfully 表示连接成功
	5. 运行当前的react-native的项目
		在当前项目的根目录打开黑窗 运行
		react-native run-android
	  注意第一次运行的时候会下载很多东西 其中有一个打包工具gradle-2.14.1-all 
	  本地已经有了这个文件 指定下载本地的文件 不然会很慢
	6. 打开当前项目的android文件夹 》 gradle 》 wrapper 》 gradle-wrapper
		修改最后一行代码 改成本地的文件		
		distributionUrl=file\:///C:/android/gradle-2.14.1-all.zip
	7. 第二次运行的时候先检查node的黑窗是否关闭 再重新允许 react-native run-android
	8. 第一次启动项目的时候还会报一个红色的错误：意思是没有获取到代码（代码是在nodejs的服务器里面 没有办法从App里面请求到Nodejs服务器）
			1. 点击右侧的中间的菜单
			2. dev Settings
			3. 点击debug server host  在输入框里面输入当前电脑的IP加上nodejs的端口
				例如 192.168.19.22:8081
			4. 重新运行项目
			5. 在App里面看到welcome to React Native 就表示项目运行成功

以下是搭建项目的相关截图：

 

标题