Weex iOS端的自動重新整理和除錯

最近開始接觸weex。目前weex尚不成熟，官方文件有些粗糙，初學者難免碰壁。這裡分享兩條我的初學經驗，供參考。

weex有乙個網頁版的預覽工具，提供了修改**後自動重新整理頁面的功能。然而作為移動端開發，網頁版工具顯然不夠，我們需要在模擬器或者真實裝置中開發和除錯。

nsstring * hotreloadurl = [[nsbundle mainbundle] objectforinfodictionarykey:@"wxsocketconnectionurl"];
_hotreloadsocket = [[srwebsocket alloc] initwithurl:[nsurl urlwithstring:hotreloadurl]];
_hotreloadsocket.delegate = self;
[_hotreloadsocket open];

我先用npm start啟動網頁預覽，然後將info.plist中socket伺服器的位址改為自己的ip再編譯執行專案。結果是不能自動重新整理，socket**也沒有被觸發。可能是位址不對！可是文件裡沒告訴我們如何獲取正確的位址。

靈機一動，網頁版能夠自動重新整理，那麼我們可以通過chrome的開發者工具監聽socket請求。開啟開發者工具，選中network標籤，設定filter為ws，然後修改js**。果然監聽到ws請求：

位址有些奇怪。檢視socket**，發現不是我們想要的資料格式。好討厭的感覺啊~

- (void)websocket:(srwebsocket *)websocket didreceivemessage:(id)message 
@try 
[self render];
}} @catch(nserror * error) {}
}

於是便請求度娘的幫助。有前輩的教程中提到，需要用weex命令+入口檔名的方式啟動專案，於是照貓畫虎：weex dist/index.js。

系統報錯並提示了正確的用法，看來教程稍微有些陳舊啦。應該這樣：weex preview dist/index.js。執行命令後自動開啟了乙個預覽網頁，和之前的頁面有些大同小異。

開啟開發者工具：

用這個位址替換專案中的位址，模擬器可以自動重新整理了！

weex官方文件告訴我們可以通過weex debug命令和chrome來除錯專案，很好很強大。於是我根據文件的說明整合了wxdevtoolsdk，並新增如下**：

[wxdevtool setdebug:yes];
[wxdevtool launchdevtooldebugwithurl:@"ws:"];

執行weex debug命令，成功後彈出乙個網頁：

修改**後，可以除錯了！不過位址後的字串8e2ea364-e514-45a1-a022-363c793d048a在重啟除錯伺服器後會變，有些坑，還是整合乙個掃一掃吧~

weex是國人開源的跨平台框架，前途可量。和reactnative相比，目前weex在開發除錯方面的便利性比較差，而且缺乏一篇融會貫通的基礎教程。讓我這個「老司機」也折騰了一番，何況乙個跨平台新手！希望以後能夠改進吧。

Weex iOS端的自動重新整理和除錯

Ajax區域性重新整理和全域性重新整理的區別

Weex iOS 端整合的一些感想

使用MUI框架模擬手機端的下拉重新整理和上拉載入功能

Weex iOS端的自動重新整理和除錯

Ajax區域性重新整理和全域性重新整理的區別

Weex iOS 端整合的一些感想

使用MUI框架模擬手機端的下拉重新整理和上拉載入功能

相關推薦