一步一步實現IONIC2/3 熱更新


1. 新建空的ionic項目

  • 命令:ionic start hotupdatetest blank

2. 進入項目文件夾

  • 命令 : cd  ./hotupdatetest

3. 全局安裝熱更新插件cordova-hot-code-push-cli,如果已經安裝了則跳過此步

  • 命令:npm install -g cordova-hot-code-push-cli

4. 添加目標平台

  • 命令:ionic cordova platform add android

5. 將熱更新插件添加到項目內

  • 命令:ionic cordova plugin add cordova-hot-code-push-plugin

6. 初始化熱更新插件

  • 命令:cordova-hcp init

7. 初始化熱更新插件后會在項目根目錄生成cordova-hcp.json的配置文件

如下

8. 在config.xml配置文件中關閉自動更新

9. 在app.component.ts中導入熱更新插件,並編寫更新邏輯

10. 打包apk

  • 命令:ionic cordova build android –prod

這個時候的app已經集成了更新功能。

11. 現在開始做些更新的動作,在home頁面中去修改一下

12. 重新打包apk或者運行ionic serve后,確保新修改的文件已經編譯到www文件內,生成本地更新配置文件

  • 命令:cordova-hcp build

13. 執行命令后會在www文件夾生成更新配置文件

14.上傳更新

這個時www文件里的文件上傳cordova-hcp.json里指定的content_url地址,打開已經安裝的最初版本的app就會自動更新修改過的頁面了。

    • 容易搞錯的地方是,生成新的版本文件時,一定要編譯后才能在www文件里生成新的文件,這個時候cordova-hcp build才能生成新的配置文件。
    • 如果需要設置動態顯示更新,則需要在app.component.ts文件里的更新文件加上loading或其它提示。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM