新做了一個ReactNative的項目,中文網的熱更新不太符合我的業務需求,所以自己上手做了一個~~~~
一、原理
熱更新原理很簡單,RN提供了getJSBundleFile方法,此方法返回一個路徑,路徑裏包含代碼構建合併的index.android.bundle文件和資源文件(drawable開頭的)。所以我們只需要再熱更新後將已經下載好的文件路徑返回,再重啓APP就完成了熱更新。
二、實踐
今天把熱更新所有的代碼打包成了一個插件,希望能幫助到各位。
插件中有些代碼來源於網上各個大佬,如有雷同,我只能說聲感謝!
git
https://github.com/Txiaomo/react-native-hot-deployment
npm
https://www.npmjs.com/package/react-native-hot-deployment
使用時需要配置自己的服務器。
熱更新需要提供一個資源包壓縮包的下載地址,我這裏默認壓縮包的命名爲bundle.zip。也就是將構建後的index.android.bundle文件和圖片資源文件(drawable開頭的文件夾)打包並壓縮爲bundle.zip。
下載完整apk包也需要提供下載地址,這些都需要自己配置。會默認下載到手機的download文件夾,下載完成自動跳轉安裝界面。
需要自定義一些東西的可以把插件下載後自行修改。
三、問題
之所以要打包圖片資源文件,是因爲返回了一個新的index.android.bundle文件路徑的時候,RN默認會從這個路徑讀取圖片,如果沒有圖片,那麼app上也不會顯示。上文中提供的插件有一個問題,我採用的方式是每次打包所有的資源文件,然後熱更新的時候也是下載的所有資源文件。不過由於是zip壓縮文件,其實也不會太大。不過我想找到一種每次更新只需要下載新圖片的方式。路過的大神們有想法請留言...