天天看点

Linux环境下React Native环境搭建

一、JDK安装(要求1.8)

1.下载1.8版本Linux 64位JDK (jdk-8u231-linux-x64)

2.tar 命令解压,然后放到一个自己认为合适的目录,直接拷贝即可

3.在系统盘 etc目录下编辑profile文件配置环境变量

4.在etc目录下执行:vi profile 或 vim profile即可打开profile文件,进入后点击一下“i”键即可编辑,编辑完成 后按Esc键,然后输入“:wq”保存退出

5.执行 source profile 让配置生效

6.环境变量配置后重启,在任何位置打开终端,输入java -version 验证是否配置成功

Linux环境下React Native环境搭建

二、Node安装(要求版本大于10,安装最新版本即可,node-v12.13.1-linux-x64)

1.下载后解压,然后同样在etc/profile中配置环境变量

2.配置后执行 source profile 让配置生效

3.环境变量配置后重启,在任何位置打开终端,输入node -v 验证是否配置成功

4.环境变量配置如下图,划黄线部分为你自己的解压目录

Linux环境下React Native环境搭建

三、安装yarn 和 react-native-cli

1.Yarn是 Facebook 提供的替代 npm 的工具,可以加速 node 模块的下载。react-native 的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务

2.命令:npm install -g yarn react-native-cli

3.执行此命令前需先安装node并配置好环境变量

4.安装后可通过 npm -v react-native -v 验证是否安装成功

四、安装watchman

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

2.watchman需要make命令编译和Python环境,所以需要先安装一些依赖

依赖命令:sudo apt install libssl-dev autoconf automake libtool python-dev

3.先执行依赖命令,然后依次执行如下命令(最新版本为4.9.0)

git clone https://github.com/facebook/watchman.git

cd watchman

git checkout v4.9.0

./autogen.sh

./configure

make

sudo make install

4.安装后可通过watchman -v验证是否成功

五、创建RN项目并运行到手机

1.在任意目录下执行 react-native init 项目名,即可创建RN项目

2.在新创建的RN项目 目录下打开终端执行命令

react-native start

react-native run-android

即可安装新建项目到手机(使用命令时,adb只能连接一个设备)

完整配置如下图

Linux环境下React Native环境搭建

六、所有验证结果如下图,安装版本不同,验证结果可能不一样

Linux环境下React Native环境搭建