运行ReactNative的开源工程

   <p>在学习 React Native 的过程中, 需要多学习其他人的代码, 则运行其他项目必不可少. 完整的 <code>React Native</code> 包含两个部分, <code>Android</code> 和 <code>iOS</code> . 本文介绍一些在运行时的注意事项. 不要太纠结于全平台, 优先学习iOS平台.</p>    <p><img src="https://simg.open-open.com/show/4a5b9702548f231c568f052c8aa0f62b.png" alt="运行ReactNative的开源工程" width="800" height="427"></p>    <p>React Native</p>    <h2>运行 iOS 版</h2>    <p>React Native 的规范或编码更偏向于 iOS, 同时一些开源项目仅支持 iOS版本. 因此, 在运行时, 优先从 iOS 版本入手.</p>    <p>安装NPM, <code>npm install</code>, 下载 Node 库的依赖.</p>    <blockquote>     <p>未安装库, 错误: <code>'RCTRootView.h' file not found</code></p>    </blockquote>    <p>进入工程目录的 <code>ios</code> 文件夹, 启动<code>xxx.xcodeproj</code>文件. 使用 <code>Xcode</code> 启动, 或 使用 <code>open xxx.xcodeproj</code> 均可.</p>    <p>直接运行项目, 即可显示. iOS 工程会自启动服务, 加载本地数据.</p>    <h3>错误</h3>    <p><strong><code>react-tools → aft</code>无法下载</strong></p>    <p>依赖的 RN 版本过低. 升级 RN 的版本, 即可, 目前低于版本16, 均无法下载 <code>aft</code> . RN 还在迭代过程中, 低版本不会向下兼容, 要抱有探索精神.</p>    <blockquote>     <p>测试0.15.0的aft可以下载, 时间较长, 耐心等待.</p>    </blockquote>    <pre>  <code class="language-java">loadDep:react-tools → aft ▌ ╢██████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░╟</code></pre>    <p>依赖 RN 的位置, <code>package.json</code> , 修改 <code>react-native</code> 项为较高版本. 高版本与低版本可能会不兼容.</p>    <blockquote>     <p>在版本号前需要添加<code>^</code>, 如<code>^0.18.0</code>.</p>    </blockquote>    <pre>  <code class="language-java">{    "name": "WeatherProject",    "version": "0.0.1",    "private": true,    "scripts": {      "start": "node_modules/react-native/packager/packager.sh"    },    "dependencies": {      "react-native": "^0.18.0"    }  }</code></pre>    <blockquote>     <p>RN 的版本号列表, <a href="/misc/goto?guid=4959671247743590692">参考</a></p>    </blockquote>    <p><strong>低版本兼容</strong></p>    <p>Log类接口修改, 添加 <code>RCTLogSource source</code> 即可.</p>    <pre>  <code class="language-java">RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message)</code></pre>    <h2>运行 Android 版</h2>    <p>多数 Demo 不包含 Android 版本. 直接于项目中, 观察 <code>index.android.js</code> 文件. 如果文件中添加新的模块, 则表示支持 Android 版; 如果是默认的<code>HelloWorld</code>, 则表示不支持. 不支持就不必启动, 使用 iOS 版本即可.</p>    <p>不支持 Android 版本的原因, 主要是 React Native 的控件有一部分是有区分的, 专门开发 Android 版或 iOS 版. 默认控件通过后缀区分, <strong>IOS</strong> 表示 iOS 独有, <strong>Android</strong> 表示 Android 独有, 未添加则表示两者均可.</p>    <p>使用 <code>react-native</code> 命令启动 Android 项目.</p>    <pre>  <code class="language-java">react-native run-android</code></pre>    <p>即shell命令: <code>cd android && ./gradlew installDebug</code></p>    <p>注意修改 Gradle 的构建版本</p>    <pre>  <code class="language-java">classpath 'com.android.tools.build:gradle:1.2.3'</code></pre>    <blockquote>     <p>否则报错:</p>     <code>Error while uploading app-debug.apk : Unknown failure</code>   </blockquote>    <p>低版本 RN 运行 Android 项目, 问题多多, 请耐心解决. 推荐使用 iOS 进行学习与演示.</p>    <p>运行项目只是开始, 要想熟练使用, 还要多多练习 RN 的编码风格.</p>    <p>OK, that's all! Enjoy it!</p>    <p><br>  </p>    <p>文／SpikeKing（简书作者）<br> 原文链接：http://www.jianshu.com/p/e366cffec87a<br>  </p>