1. 程式人生 > >React Native工程離線執行(ios)

React Native工程離線執行(ios)

React Native工程離線執行的重點是將index.ios.bundle檔案儲存在機器本地,index.ios.bundle檔案是工程編譯後的js檔案的打包,index.ios.bundle 將被 packager伺服器 建立。。

純RN工程

純RN工程在工程建立好後就XCode目錄中就包含了main.jsbundle檔案,只不過檔案是不存在的(XCode檔名紅色),這個檔案就是編譯的時候由packager伺服器打包好的index.ios.bundle檔案。

修改AppDelegate.m中的jsCodeLocation

註釋掉

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

取消註釋

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

打包

純RN工程離線執行只要按照正常的流程打包app即可,因為index.ios.bundle在打包過程中會自動生成並繫結到main.jsbundle,離線執行時就會根據jsCodeLocation找到js檔案了。

混編工程

由於混編工程一開始是由XCode建立的,並不存在main.jsbundle檔案,因此需要手動generate。

生成本地main.jsbundle

在專案根目錄下執行

curl http://localhost:8081/index.ios.bundle -o main.jsbundle

如果curl命令執行失敗,請確保伺服器已開啟,否則提示8081埠8081無法連線。
執行成功後工程目錄中就多了main.jsbundle檔案,然後將他拖到XCode中。

設定jsCodeLocation指向本地main.jsbundle檔案

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

打包

也是正常的打包流程。

其他

如果不希望在離線時除錯,確保打包之前將scheme中的archive模式設定成release,這樣就不會彈出除錯選單了。