React Native 填坑指南

Marno發表於2017-02-14
  • 本文為 Marno 原創,轉載必須保留出處!
  • 公眾號【 aMarno 】,關注後回覆 RN 加入交流群
  • React Native 優秀開源專案大全:www.marno.cn

★ 如何使用

  • 在當前網頁使用 ctrl + F (commond + F)開啟瀏覽器全域性搜尋框
  • 輸入你遇到錯誤的關鍵字(關鍵字要短)
  • 如無果,那恭喜你遇到了我沒有遇到的坑(哈哈~)
  • 此時加 RN 群聊吧,說不定有人遇到過
  • 也可以在 issue 中提交你解決過的問題,我們會定期整理到文件中,幫助更多人
  • 關注公眾號 aMarno ,獲取本文最新動態

★ 填坑列表

  1. 使用中文指導中的命令列安裝【 Chocolatey 】失敗,無法使用【 choco 】命令

    答:首先該命令是可以成功安裝的,只不過下載過程有點慢,而且最好關閉360等軟體;如果你等了很久還不行,就直接中斷再試一次。
    如果有VPN,直接VPN掛起嘗試,重試的時候記得去下載目錄把之前的殘餘檔案手動刪除。
    我就是因為這個試了好久,明明檔案都下載完了,但是就是不能識別【choco】命令,後來就是手動刪除該資料夾後重試就通過了。
    然後接下來的安裝nodejs和python一般就沒什麼問題了。

  2. 初始化專案的時候輸入【 react-native init AwesomeProject 】命令後,一直顯示installing,就沒有反應了,是不是哪裡步驟出錯了?

    React Native 填坑指南

    答:步驟沒有錯,這個命令執行也沒有問題,因為這裡下載的檔案有點大,所以會等很久,如果網速不好建議還是找個網好的地方再試,
    還是建議使用VPN下載,我也是試了差不多有10多次才成功,如果需要中斷直接ctrl+c,然後去C盤下把AwesomeProject目錄刪除再重試。

  3. 為什麼是 AwesomeProject 呢?這個名字可以變嗎?一定要在 C 盤 init 嗎?

    答:肯定不是,存放工程的目錄和工程的名字可以自己決定,有些人習慣吧工程統一放到一個碟符下面,不管哪個盤,肯定很少有人直接放C盤。如果自己更改了碟符後,在執行後面的【reavt-native run-android】命令的時候,記得把執行目錄切換到你自己更改後的目錄。

  4. 執行【react-native run-android】報錯,編譯已經通過了,而且APK也生成了,但是到安裝的時候出錯

    React Native 填坑指南
    報錯一

    React Native 填坑指南
    報錯二

    答:好像出現這個問題的原因有點多,找了幾個解決方案,根據自己的情況看一下吧,不過很多情況是因為gradle的原因,預設初始化專案後的gradle版本是1.3.1,改回1.2.0基本可以解決這個問題,改成1.2.0之後需要重新編譯,一次不就多試幾次,我試了第二次才成功

    1.github官方issue

    2.stackoverflow提問

    3.CSDN

  5. 使用真機模擬,搖晃手機無法彈出 dev menu

    答:如果是安卓手機需要用到【懸浮窗】許可權,到手機設定裡看下該許可權是否開啟

  6. 在 cmd 輸入某個命令的時候,提示【"xxx"不是內部或外部命令,也不是可執行的程式或批處理檔案】

    答:這是因為沒有在系統環境變數中配置該命令可執行程式,請重新檢視文件中配置環境變數的部分,貼一下我的配置,我是windows10操作,如果環境變數少了紅框裡的內容可能就無法執行

    React Native 填坑指南

  7. 我下載了別人的開源專案,怎麼在我的電腦上執行呢?

    答:terminal切換到這個目錄後
    第一步【npm install】
    第二步【react-native link】
    第三步【 react-native run-android】
    其中第二步並不是必須的,有一些npm_module用到了native功能時就需要先進行一下link才可以編譯執行。比如:react-native-vector-icons,react-native-video等

  8. npm 安裝三方元件庫一直報錯

    答:把工程都關閉,然後重灌一遍nodejs,然後在終端進入該目錄後,重新安裝試一下。我有好幾個庫出現這樣的問題,在網上找了很久的教程,翻q出去還找了好久,結果重灌nodejs就解決了

  9. React Native 新增圖片到專案後報錯:...Unexpected character '◆'(1:0) at ...

    如果是Android的話將專案中所有build檔案刪除後重新編譯即可。iOS不知道會不會出現這個問題。

  10. 新增react-native-video報錯:provided dependencies can only be jars. com.facebook.react:react-native:aar.....is an Android Library......

    按照react-native-native的官方整合方式新增後發現會報錯,按照下圖方式修改,並把自己專案的android資料夾中所有【build資料夾】整個刪掉後再重新編譯!新增 react-native-video 需要執行【 react-native link 】命令,具體可以多在github上看下官方文件。

    React Native 填坑指南

相關文章