React Native 开发常用命令

一、环境搭建命令

必须安装的依赖有：Node、Watchman 和 React Native 命令行工具以及 Xcode（iOS平台需要）、Android Studio（Android平台需要）。

1.安装Node, Watchman

Watchman则是由 Facebook 提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能（packager 可以快速捕捉文件的变化从而实现实时刷新）。

推荐使用Homebrew来安装 Node 和 Watchman。在命令行中执行下列命令安装：

brew install node
brew install watchman

安装完 Node 后建议设置 npm 镜像以加速后面的过程:

注意：不要使用 cnpm！cnpm 安装的模块路径比较奇怪，packager 不能正常识别！

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

2.安装Yarn、React Native 的命令行工具（react-native-cli）

Yarn是 Facebook 提供的替代 npm 的工具，可以加速 node 模块的下载。React Native 的命令行工具用于执行创建、初始化、更新项目、运行打包服务（packager）等任务。

安装完 yarn 后同理也要设置镜像源：

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

安装完 yarn 之后就可以用 yarn 代替 npm 了，例如用yarn代替npm install命令，用yarn add 某第三方库名代替npm install 某第三方库名。

安装Xcode

可以通过 App Store 或是到Apple 开发者官网上下载。这一步骤会同时安装 Xcode IDE、Xcode 的命令行工具和 iOS 模拟器。

安装Android Studio

二、开发命令

1.创建新项目：

！！！注意！！！：init 命令默认会创建最新的版本，而目前最新的 0.45 及以上版本需要下载 boost 等几个第三方库编译。这些库在国内即便翻墙也很难下载成功，导致很多人无法运行iOS项目！！！中文网在论坛中提供了这些库的国内下载链接。如果你嫌麻烦，又没有对新版本的需求，那么可以暂时创建0.44.3的版本。

react-native init AwesomeProject

提示：你可以使用--version参数（注意是两个杠）创建指定版本的项目。例如react-native init MyApp --version 0.44.3。注意版本号必须精确到两个小数点。

react-native init AwesomeProject --version 0.57.1

如果你是想把 React Native 集成到现有的原生项目中，则步骤完全不同，请参考集成到现有原生应用。

2.安装/卸载依赖库

  1）、npm install //重新安装node_modules
  2）、npm install react-native-camera  //添加依赖:react-native-camera
  3）、npm uninstall react-native-camera //移除依赖库（需要link的依赖，如果想进行移除，必须先进行unlink,然后才能进行移除操作）
  4）、react-native link //自动链接所有可以自动链接的依赖库
  5）、react-native link  react-native-camera //自动链接单个依赖:react-native-camera
  6）、react-native unlink react-native-camera  //自动断开链接单个依赖:react-native-camera
  7）、rm -rf node_modules  //移除node_modules

或使用yarn:

yarn add react-native-camera  //添加依赖:react-native-camera
yarn remove react-native-camera  //移除依赖库: react-native-camera

3.模拟器运行命令

xcrun simctl list devices //查看具体可用的设备名称
**iOS模拟器：**
react-native run-ios //目前默认为"iPhone 6"
react-native run-ios --simulator "iPhone 7s" //使用--simulator参数，在其后加上要使用的设备名称来指定要模拟的设备类型

Command⌘ + R // 模拟器reload 界面
Command⌘+D //快速打开窗口模式 (可以点击remote debug)
ctrl+alt+回车 //可以直接开启chrome remote debug 模式
Command⌘+option + J（chrome）//chrome 弹出debug窗口模式，调试的具体日志

**Android:**
react-native run-android //模拟器（前提已开启模拟器）
react-native run-android //真机（前提已usb链接真机）
R,R //连续点击两次R键， 模拟器reload 界面
Command⌘ + M //快捷键来快速打开Developer Menu

4.打包命令，iOS打包(iOS打包详解戳这里)

npm run bundle-ios   //打包ios bundle

5.打包命令，android打包（Android打包详情）：

android打包bundle的配置：（下面两种写法都可以）方便起见我们也配置到package.json文件中：
ps: package.json 中配置的命名，都可以用npm run xxx-xxx进行触发，比如配置好bundle打包命令后，执行npm run bundle-android即可输出bundle了

1."bundle-android": "node node_modules/react-native/local-cli/cli.js bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res"
2."bundle-android": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res",
//package.json中配置好bundle打包命令后，执行:
npm run bundle-android//输出bundle

//android打包apk命令：
cd android //进入到android项目目录
./gradlew clean //先清除打包缓存
./gradlew assembleDebug //打debug环境apk
./gradlew assembleRelease //打release环境apk

6.其它Android命令：

adb devices //查看可用调试设备

adb install /Users/../build/outputs/apk/debug/app-debug.apk  //命令安装apk到手机