1. 程式人生 > >Windows下搭建react-native開發環境

Windows下搭建react-native開發環境

最近公司沒有什麼事情,所以決定研究一下react-native.

react-native是Facebook研發的一種用於移動端研發hybrid app 的技術(研究的不深,目前只知道這個作用),那麼對於react-native的環境搭建卻是有些複雜.

那麼對於剛剛完成環境搭建的我來說,趕緊把這個過程記錄下來,等忘記的時候拿出來閱覽一下.

好了,廢話不說了,進入正題.

第一步,我們需要安裝各種軟體:

    直接預設安裝就行,完成後可以在cmd裡面輸入node -v確認是否成功.

    ps:這裡有個坑,安裝完成後會自動新增環境變數,但是有的機器在cmd中依然找不到這個軟體,不妨重啟一下試試.

    這個沒什麼好說的,一直next完成安裝即可.

    同樣的,安裝完成後在cmd中輸入命令 python -V(大寫的)確認是否成功.並在環境變數(PATH)中新增python的根目錄.

    ps:顯示版本號表示成功.

4,jdk,並且配置環境變數(JAVA_HOME)

5,Android-sdk,並且配置環境變數(ANDROID_SDK_HOME),並在環境變數(PATH)中新增*:\Android-sdk\platform-tools

    ps:*表示你Android-sdk所在的碟符.

第三步,在cmd中通過npm包管理器安裝react-native

1,在cmd中依次輸入命令(使用淘寶提供的映象)npm config set registry https://
registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist2,安裝react-nativenpm install -g react-native-cli

第四步,建立專案,並執行

1,在cmd中輸入命令:react-native init 專案名稱.

    ps:這裡你需要將cmd的當前目錄設定為你想把專案存放的位置.

    例如:此時如果輸入react-native init myrn ,就會在c盤users的dt資料夾下建立myrn.

2,在cmd中輸入命令:react-native run-android執行專案.

    ps:執行專案前,需要將cmd的當前位置移動到你建立專案的根目錄.

    ps:在此時,會自動啟動node伺服器.

    ps:如果使用真機執行,則需要在應用啟動後搖一搖開啟Dev setting選單,進入Debug server host & port for device 中設定ip地址:埠號(8081),注意:手機要與電腦處在同一網路中.

第五步,安裝react-native開發環境

    Android的開發環境就不需要說了,我想看到此文章的同學都不陌生,那麼如何搭建react-native的開發環境呢?

1,在這裡我是使用Intellij IDEA作為react-native的開發環境的,也可以用其他的.功能都是差不多的.

2,開啟剛才建立的程式,待載入完成後,點選Run->run選項.配置npm啟動.如下圖


    點選apply,就完成了配置.

    ps:其實這一步就是配置了使用工具啟動npm伺服器.

好了,現在基本就完成了整個環境搭建的過程.

有哪裡不對的,請下方留言,共同探討哦.