天天看點

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環境搭建