?

開門見山，本文主題：cordova-hot-code-push

作用：cordova熱更新插件，提供了在應用程序中對基于Web的內容進行自動更新的功能。

GitHub地址：https://github.com/nordnet/cordova-hot-code-push

?

另外一并介紹：cordova-hot-code-push-cli

作用：cordova-hot-code-push插件配套使用的命令行工具。

GitHub地址：https://github.com/nordnet/cordova-hot-code-push-cli

?

使用步驟：

1.安裝cordova-hot-code-push-cli：npm install -g cordova-hot-code-push-cli

說明：此CLI主要用于幫助熱更新插件生成和維護配置文件，例如：chcp.json、chcp.manifest等。

不安裝此CLI也可以直接使用熱更新插件，但還是強烈建議大家安裝，詳細內容請前往GitHub了解。

?

2.安裝熱更新插件：ionic?cordova plugin add cordova-hot-code-push-plugin

說明：首先通過cd命令，進入ionic項目的根目錄下，然后執行插件安裝命令。

?

3.安裝開發插件：ionic?cordova plugin add cordova-hot-code-push-local-dev-addon

說明：開發插件不是必需，其主要作用是在熱更新插件的開發和測試階段方便快速構建應用并應用更新的內容，

避免繁瑣的編譯、構建、重新啟動應用等步驟。官方建議在開發階段安裝此插件，以方便我們進行開發和測試。

注意，在進行應用的發布時，務必將此插件卸載。

?安裝完成后，可在項目代碼的plugins目錄下看到插件：

?

?4.通過cordova-hot-code-push-cli中的cordova-hcp命令啟動一個server：cordova-hcp server

關于cordova-hcp的其他命令，請參考：https://github.com/nordnet/cordova-hot-code-push-cli#commands

?

5.將項目打包并安裝到設備，此步驟不詳細描述，拿android舉例，可用的命令是ionic cordova build android或者ionic cordova run android

注意：執行這一步的時候，上面的cordova-hcp server窗口不要關，重新開一個Node.js command prompt窗口來完成你的其他操作。

因為cordova-hcp server相當于起了一個遠程服務器，來運行你服務器端的程序，后面APP在檢測更新的時候是需要用到此server的。

?

6.項目完成打包并安裝到設備上以后，運行APP。

?

7.接下來就是測試熱更新的時候了，不要眨眼睛~

我們讓代碼產生一些變化，比如，我修改一下我工程Home Page的html內容：

你切到cordova-hcp server的窗口，你會發現server已經檢測到了程序變化，窗口中會出現類似：

File changed：c:\xxxxxxxxxxxxxxx 的提示文字。包括用戶連接，斷開連接，都會有提示。

?你再看一下設備上的APP，程序會自動加載最新的內容，

這樣，我們就在不通過重新編譯打包、安裝（或者是從應用市場下載新版本、安裝）的情況下，完成了對APP的更新。

這個還是蠻酷的~~~

?

需要注意的兩個地方，在GitHub的介紹里是沒有的，大家在測試的時候，請注意一下：

（1）.手機必須聯網，無網絡連接的手機是無法測試熱更新的。我用的是電信4G網絡測試；應該是需要外網，內網我沒有測試。

　　有時間的童鞋也可以測試一下內網服務器，服務器信息在起服務的時候就可以看到：

?

?（2）.ionic項目產生變化的時候，我們要通過ionic serve命令讓Ionic CLI來幫我們編譯最新代碼到www目錄下。

　　這個也是另外一個單獨的窗口來執行，不要停掉cordova-hcp server服務。

　　GitHub在介紹這一部分的時候，只是拿cordova的項目舉例，只是直接修改了www目錄下的index.html文件來測試變化。

　　而我們使用的是Ionic項目，并且修改的是page里面是html文件或者ts文件。所以必須要使用ionic serve進行編譯。

?

?Ok。寫到這里，本篇關于ionic 項目的熱更新測試基本完成。

另外我會單獨寫一篇關于自己搭建服務器來實現熱更新的文章，而不是借助于cordova-hot-code-push-local-dev-addon插件。

不過本質是差不多的，只不過開發插件幫我們簡化了一部分復雜的配置過程。

參見：http://www.cnblogs.com/crazyprogrammer/p/7763573.html

?

轉載于:https://www.cnblogs.com/tomkart/p/7755148.html

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的Ionic APP 热更新的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。