Windows下react-native安装步骤以及安装时候遇到各类已填平的坑

Facebook 在React.js Conf 2015 大会上推出了基于 JavaScript 的开源框架 React Native，本中文教程翻译自 React Native 官方文档。

React Native 结合了 Web 应用和 Native 应用的优势，可以使用 JavaScript 来开发 iOS 和 Android 原生应用。在 JavaScript 中用 React 抽象操作系统原生的 UI 组件，代替 DOM 元素来渲染等。

React Native 使你能够使用基于 JavaScript 和 React 一致的开发体验在本地平台上构建世界一流的应用程序体验。React Native 把重点放在所有开发人员关心的平台的开发效率上——开发者只需学习一种语言就能轻易为任何平台高效地编写代码。Facebook 在多个应用程序产品中使用了 React Native，并将继续为 React Native 投资。

准备

安装Java环境（自行google或baidu）。

安装Android SDK（自行google或baidu）。

安装node和git参考我一篇搭建博客有涉及这俩个的安装。

安装python下载路径，我按照2.7右边那个版本。为什么选择2.7,因为3.x.x不支持详情看这里

这边需要注意下，需要配置Java和Android SDK路径到系统环境的Path

这里需要注意设置环境变量ANDROID_HOME：Android SDK Manager的位置 例如：（ANDROID_HOME=> D:\Android\sdk）设置环境变量PATH：例如：（PATH=> %ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools）

安装react-native：

打开CMD命令窗口，选择自己要放的文件目录下，使用git clone命令从github隆react-native至本地。

git clone https:github.com/facebook/react-native.git

* 接着进入react-native目录下的react-native-cli目录，输入命令。

npm install -g

创建react-native项目

指定到目录下执行以下命令，创建新的项目AwesomeProject。

react-native init AwesomeProject

由于被墙的原因，会比较慢，耐心等待！

运行package

进到刚创建的AwesomeProject，执行react-native start。

cd AwesomeProject
react-native start

* 此时可以通过浏览器访问 http://localhost:8081/index.android.bundle?platform=android，出现如下页面表示服务端已经可以了。

cmd运行项目

一种先打开模拟器或者链接手机设备。

另外再启动一个新的命令行,到你的项目下，执行(设备允许usb调试)。

react-native run-android

成功了！

另一种没有开模拟器或者链接手机设备。

也是启动上面那句代码

react-native run-android

之后配置路径请看我朋友的文章

https://duduzai.github.io/2016/03/23/SetupReactNativeInWindows/

错误集合：



没有连接上模拟器或者手机设备，请开模拟器或者连接上手机设备在执行

react-native run-android

如果构建项目删除，但发现Windows删除不了过长的文件，这边有工具可以安装下解决win下文件目录太长无法删除的问题

安装
npm install fuckwinfsdel -g
使用
fuckwinfsdel youdir
例
fuckwinfsdel node_modules
将会删除当前目录下 node_modules 文件夹。

fuckwinfsdel D:\expressgit\node_modules
将会删除D:\expressgit\node_modules文件夹。

项目地址 https://github.com/hezedu/fuckwinfsdel[/code] 
欢迎关注我的博客：

http://blog.csdn.net/wx_jin

交流群：313870489

参考文章：

https://duduzai.github.io/2016/03/23/SetupReactNativeInWindows/

http://wiki.jikexueyuan.com/project/react-native/