React Native环境搭建

接触RN(英文)起始RN(中文)

我第一次参考了英文文档，采坑无数。。。所以最好还是参考中文文档吧

硬件要求：

Mac电脑

软件要求

1. Xcode（9.4及以上）
2. HomeBlew（操作系统上的一个安装包管理器，可以方便后续安装包的安装）
   安装过程中需要输入密码，还需要下载，等待一会即可
   终端命令

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

3. Node（8.3及以上）、Watchman
   Watchman是Facebook用于观察文件系统变化的工具，安装可获得更好的性能。
   安装HomeBlew之后执行以下命令

brew install node
brew install watchman

安装完成之后建议设置npm镜像以加速后面的过程
在终端输入以下命令

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

4. Yarn、React Native CLI(RN的命令行工具)
   用来开发RN的命令行工具
   安装命令

npm install -g yarn react-native-cli

yarn安装完成后也要设置镜像资源

yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

然后就可以愉快地耍大刀咯

创建项目

Hello world程序员之始，那么我们就使用React Native命令行界面创建第一个RN项目，名称为:HelloWorld
终端命令

react-native init HelloWorld

稍微等一会即可创建完成，默认创建的项目位置为终端所指目录

项目结构

运行项目

在React Native项目文件夹中运行react-native run-ios:，然后就可以看到新应用在iOS模拟器中运行了
终端命令

cd HelloWorld  // 切换目录到HelloWorld项目中
react-native run-ios

react-native run-ios只是运行应用程序的一种方式，当然我们也可以使用Xcode/Nuclide运行项目

坑来了

坑一

运行HelloWorld项目报错，错误如下

** BUILD FAILED **


The following commands produced analyzer issues:
    Analyze Base/RCTModuleMethod.mm

    Analyze Modules/RCTUIManager.m
(2 commands with analyzer issues)

The following build commands failed:
    CompileC /Users/zhaohaiming/HelloWorld/ios/build/Build/Intermediates.noindex/RCTLinking.build/Debug-iphonesimulator/RCTLinking.build/Objects-normal/x86_64/RCTLinkingManager.o RCTLinkingManager.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)

Installing build/Build/Products/Debug-iphonesimulator/HelloWorld.app
An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2):
Failed to install the requested application
An application bundle was not found at the provided path.
Provide a valid path to the desired application bundle.
Print: Entry, ":CFBundleIdentifier", Does Not Exist

Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/HelloWorld.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist


Error: Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/HelloWorld.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist

    at checkExecSyncError (child_process.js:611:11)
    at Object.execFileSync (child_process.js:629:13)
    at Promise.then (/Users/zhaohaiming/HelloWorld/node_modules/react-native/local-cli/runIOS/runIOS.js:208:5)

试了很多方法都不行，最终采用降低版本的方法，结果提示BUILD SUCCESSED
具体方法：

方法一(不降级)：

参考这里
不过我按照上述方法试了也是没有用

方法二(降级)：

先贴出我的环境（降级后的）

node：10.10.0
react：16.3.0-alpha.1
react-native：0.54.3
Xcode：9.2

1. 打开项目中的package.json文件，修改"dependencies"字典中的值如下:

"dependencies": {
    "react": "16.3.0-alpha.1",
    "react-native": "0.54.3"
  }

2. 执行命令react-native upgrade进行降级，终端会有提示，是否要降级，回复y然后回车，重复此操作直至提示Successfully upgraded this project to react-native v0.54.3即可
3. 这时候即可执行命令react-native run-ios编译项目，编译过程中会自动调起模拟器，自动打开命令行工具，最终效果如下：

成功填坑

另外附一个友情链接，这里列出了很多运行红屏错误以及其他的错误，希望能够帮助到有需要的人
React Native开发错误警告处理总结（已解决 ！持续更新）

友情链接：React-Native学习指南 资源列表