使用WebStorm初始化React Native项目步骤
image
- 点击WebStorm面板上的
Create New Project按钮，进入创建React Native项目页面，在左侧选项中选择React Native选项，同时在右侧的Location:中修改项目的本地路径untitled描述，此描述标识项目的名称，例如：StudyReactNativeApp，随下的两个路径保持默认，然后点击右侧底部Create按钮。
image
3.随后在WebStrom中即可看见刚才创建的项目，WebStrom会自动初始化配置项目所需要的组件和库
image
3.配置完成时会提示如下图的信息，到这里项目已初始化完成，即可选择在模拟器上运行查看效果：
- 在android模拟器上运行的命令：
react-native run-android - 在iOS模拟器上运行的命令：
react-native run-ios，这里可以直接在WebStorm底下左侧集成的终端中运行以上命令，这里选择查看下android的效果：
image
4.命令运行后这里一般可能会出现的错误：
第一个错误如下图：提示工程找不到我们的android SDK。
image
解决方法：在工程的根目录下的android文件下直接新建或是拷贝一个已有Android项目的local.properties的文件即可放入其中即可，注意.properties文件的内容就只有标识SDK的路径即可，如下：
这里的USERNAME就是当前电脑的用户名，放入其中后再次运行上面的Android命令。
image
第二个错误如下：提示Genymotion的默认SDK路径是它自己的ADB路径，而非我们常用的ADB。
........
04:16:28 E/ddms: '/Users/maowangxin/Library/Android/sdk/platform-tools/adb,start-server' failed -- run manually if necessary
:app:installDebug FAILED
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: Could not create ADB Bridge. ADB location: /Users/maowangxin/Library/Android/sdk/platform-tools/adb
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
BUILD FAILED
Total time: 1 mins 59.919 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html
解决方法：修改下Genymotion的模拟器路径即可。点击setting -> ADB -> ANdroid SDK中输入当前Android的SDk即可。
image
5.当运行命令运行完成时，终端会提示如下信息，即表示已成功运行到Andoid模拟器上：
image
到Andoid模拟器桌面点击StudyReactNativeApp App查看效果如下：
image
在iOS模拟器上查看效果，一般在iOS模拟器运行都不会有什么问题。
直接输入命令：react-native run-ios
查看效果：
image
把项目上传至自己的Github仓库：
1.进入项目所在的文件夹：cd ../StudyReactNativeApp
2.初始化项目git仓库： git init
3.添加远程仓库地址关联：git remote add origin https://github.com/luocheng2013/StudyReactNativeApp.git
4.添加项目本地所有文件到版本控制：git add .
5.提交项目到本地仓库： git commit -m"初始化ReactNative项目"
6.推送项目到远程仓库： git push origin master
7.上传项目至Github仓库完成。
网友评论