Mac和Windows安裝搭建React Native環境教程如下:
- Mac OS X版本:Mac OS X安裝React Native環境點擊進入....
- Windows版本:Windows系統安裝React Native環境點擊進入...
1.Windows環境Server Start問題
根據官方文檔更新(點擊進入)，具體截圖如下:
如果你現在採用的是Windows系統進行開發React Native項目，那麼終端運行react-native run-android命令該打包程序將不會自動開啓，所以可以採用如下的命令: cd MyAwesmomeApp 然後react-native start就可以進行運行啦。如果在運行過程中遇到了如下的超時錯誤:ERROR Wathcer took too long to load。我們可以修改react-native/packager/react-packager/src/DependencyResolver/FileWatcher/index.js該文件的超時時間值即可
2.Windows環境運行官方Demo(UIExplorer,Movies等項目)
大家肯定會根據Reac Native文檔進行執行下面的命令進行運行如下:
|
1
2 3 |
cd react-native
./gradlew :Examples:Movies:android:app:installDebug ./packager/packager.sh |
但是這樣問題出現Windows下面怎麼樣執行shell腳本？
解決方案:Windows環境需要安裝cygwin之後就可以直接這樣執行shell腳本啦 https://www.cygwin.com/
Windows版本超詳細編譯運行官方實例項目請點擊進入....
3.React Native(RN)啓動不成功,unable to download js bundle錯誤解決方案
解決方案如下:
- 3.1.首先需要設置IP和端口，默認端口是8081，手機(模擬器)和電腦在同一個網絡中，查詢電腦的IP地址。
- 3.2.手動去刪除.babelrc隱藏文件，具體文件目錄爲:node_modules/react-deep-force-update/.babelrc
- 如果是其他版本，那也是需要刪除的不過路徑已經發生變化了。具體路徑:/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update
- 3.3.最後重點 Android項目關閉終端重新執行運行命令，iOS項目也需要關閉服務終端,重新啓動packager
3.WebStorm不識別React Native語法解決方案
大家可能會很奇怪,明明自己電腦react native,jscs,react-template都安裝了，可以爲什麼打開react native項目文件還是各種報錯呢？如下圖：
遇到這個問題還是比較簡單，只需要開啓JSX語法支持即可，具體解決方案如下:
Preferences -> Languages and Frameworks -> JavaScript -> language version下拉框裏選JSX Harmony
4.啓動出現紅色界面,提示沒有註冊 unRegisteredProject
錯誤原因:是提示你的app模塊沒有進行註冊
解決辦法:就是查看你的index.android.bundle或者index.ios.bundle中的最下面寫的那個localproject和你android或者ios項目中寫的是不是一樣即可
AppRegistry.registerComponent('localproject', () => projectname);
5.啓動運行下載gradle速度太慢,並且容易卡死(感謝羣友ˋ狠ㄨ得意提供支持)
我們經常運行項目的時候會需要進行下載gradle，不過由於網絡或者和諧的問題經常下載需要花很長時間或者直接超時以及下載失敗!
解決方案如下:我們可以按照AndroidStudio的方式採用Gradle離線版本，下載地址:http://services.gradle.org/distributions/gradle-2.4-all.zip
下載完之後打開當前需要運行的項目中的gradle-wrapper.properties文件進行如下配置，就可以採用離線版本了，速度非常快哦~
羣裏有人反應Gradle經常下載不了，我這邊上傳了2.4和2.7壓縮包到百度網盤大家可以點擊下載一下:
gradle2.4版本:鏈接:
http://pan.baidu.com/s/1o7m3kd8 密碼: tqa2
gradle2.7版本:鏈接:
http://pan.baidu.com/s/1kUvwOHD 密碼: 28e5
6.運行項目的時候transforming進度達到100%,但是進度最後差一點例如399/400
具體錯誤截圖如下:
該問題解決方案，具體可以查看上面第三點刪除中react-force-update/.babelrc文件,然後重新運行即可~
7.Watcher took too long to load (WatchmanWatcher)該錯誤解決方案方案
具體錯誤截圖如下:
根據截圖中的日誌提醒的解決方案，我們打開:https://facebook.github.io/watchman/docs/troubleshooting.html 該網頁去尋找解決方案。在頁面的最底部有更新watchman的代碼:
|
1
2
3
|
watchman shutdown-serverbrew updatebrew reinstall watchman |
接下來重新運行reactnative項目即可。
8.windows版本init項目錯誤,終端提醒讓你查看npm_debug.log
具體錯誤截圖如下:
遇到遇到這個問題首先命令行查看你一下你的npm版本具體命令:npm --version 如果你的版本是2.4左右例如:
這時你就需要進行升級npm的版本了，npm2在windows系統不支持，需要升級到npm3以上。具體升級版本點擊請查看 該該文章的中間有升級方法。
9.RCTNetworking.sendRequest got 7 arguments, expected 6
有童鞋導入一個module的時候運行可能會出現這個錯誤，該錯誤已經在0.19版本修改了。建議大家react native升級到0.19版本:升級詳情請點擊
同時fix android項目中的build.gradle文件:compile 'com.facebook.react:react-native:0.19.0'
如果你有積累下來的問題解決方案，可以聯繫並且發送給我~注意加羣React Native技術交流1羣:282693535
尊重原創，轉載請註明：From Sky丶清（http://www.lcode.org/） 侵權必究！