一、 安装 node
-
前往 node 官网 下载对应版本的压缩包，React Native 需要 node 版本 V10 以上
Ubuntu 64位 node 压缩包
-
将压缩包 [node-v***.tar.xz] 解压到你想放置的目录，例如：/home/pen/develop/tools/node-v10.16.0-linux-x64
-
打开终端，执行如下指令
node -v
npm -v
如果上面两个指令出现了对应的版本，先卸载在进行安装；卸载指令为：
sudo apt-get remove node
sudo apt-get remove npm
- 设置 node 全局目录可用
sudo ln -s /home/pen/develop/tools/node-v10.16.0-linux-x64/bin/node /usr/local/bin/
sudo ln -s /home/pen/develop/tools/node-v10.16.0-linux-x64/bin/npm /usr/local/bin/
上面指令中的 /home/pen/develop/tools/node-v10.16.0-linux-x64/ 需要第2步解压缩放置的目录；
二、 安装 yarn
- 按照 yarn 官网 提供的指令，安装 yarn
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn
- 执行 install yarn 的时候，笔者提示了需要先安装 cmdtest，直接按照给出的指令安装即可
sudo apt install cmdtest
然后再执行 sudo apt-get install yarn 安装 yarn 即可
三、 安装 react-native-cli
- 执行下面指令安装
sudo 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
- 其他的 JDK 环境 和 Android 环境这里就不介绍了；将 react-native 设置为全局目录可用
sudo ln -s /home/pen/develop/tools/node-v10.16.0-linux-x64/bin/react-native /usr/local/bin/
同样的，将 /home/pen/develop/tools/node-v10.16.0-linux-x64/ 替换成你的 node 目录；如果出现错误提示 而执行下面指令可以看到确实安装了 react-native-cli，即为上面 react-native 没有设置成全局目录可用
npm list -g --depth=0
- 使用 react-native 创建一个新项目
react-native init ProjectName
React Native 初始化成功
- 运行到Android设备，cd进入到上面创建的项目目录下，执行如下执行运行，第一次运行耗的时间将会有10多分钟，期间可以去喝杯咖啡了n(≧▽≦)n
react-native run-android
四、补充
Ubuntu 16.0.4 系统；当第一次clone项目，运行react-native run-android 跑不起来，并且提示如下。可以尝试参考 爆栈网 解决办法：
error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.
- cd 进入项目路径，运行下面指令
ls -l android/gradlew
- 如果文件权限不像下面所示,执行第三步，添加权限
-rwxr-xr-x 'links' 'owner' 'group' 'size' 'time' android/gradlew
- 给 android/gradlew 文件添加权限
chmod 755 android/gradlew
- 重新执行 react-native run-android，等待下载依赖，编译到运行
网友评论