版本：v8

即時重載

當您在開發環境中變更應用程式的程式碼時，使用即時重載選項將會重新載入瀏覽器或 Web View。這對於使用硬體裝置進行開發特別有用。

術語

即時重載是一個合併的術語。使用 ionic serve 時，即時重載僅指在進行變更時重新載入瀏覽器。即時重載也可以與 Capacitor 和 Cordova 一起使用，在虛擬和硬體裝置上提供相同的體驗，這樣就不需要重新部署原生二進位檔。

由於即時重載需要 Web View 從電腦託管的 URL 載入您的應用程式，而不是僅讀取裝置上的檔案，因此為硬體裝置設定即時重載可能會很棘手。

與常規裝置部署一樣，您需要一條電纜將裝置連接到電腦。不同之處在於 Ionic CLI 會設定 Web View 從您電腦上的開發伺服器載入您的應用程式。

若要將即時重載與 Capacitor 搭配使用，請確保您使用的是虛擬裝置或連接到與電腦相同 Wi-Fi 網路的硬體裝置。然後，您需要使用 --external 旗標指定您想要為開發伺服器使用外部 IP 位址。

$ ionic capacitor run ios -l --external
$ ionic capacitor run android -l --external

注意

請記住，使用 --external 選項時，您 Wi-Fi 網路上的其他人也可以存取您的應用程式。

對於 Android 裝置，Ionic CLI 會自動轉送開發伺服器連接埠。這表示您可以使用 localhost 位址，當在 Web View 中載入時，它將參照您的電腦，而不是裝置。

以下的一體式命令將會在 localhost 上啟動即時重載伺服器，並使用 Cordova 將應用程式部署到 Android 裝置

ionic cordova run android -l

對於 iOS 裝置，連接埠轉送還不是一個選項。這表示您需要將裝置連接到與電腦相同的 Wi-Fi 網路，並為開發伺服器使用外部位址。

在某些情況下，Ionic CLI 不會知道要使用哪個位址設定 Web View，因此可能會提示您選擇一個。請務必選擇您 Wi-Fi 網路上的電腦位址。

以下的一體式命令將會在所有位址上啟動即時重載伺服器，並使用 Cordova 將應用程式部署到 iOS 裝置

ionic cordova run ios -l --external

注意

請記住，使用 --external 選項時，您 Wi-Fi 網路上的其他人也可以存取您的應用程式。

使用 Cordova 時，請使用 --device、--emulator 和 --target 選項來縮小目標裝置的範圍。使用 --list 選項來列出所有目標。請參閱指令文件中的用法。
您可以透過使用 ionic serve 和 ionic cordova run 或 ionic capacitor run 的 --livereload-url 選項來分隔開發伺服器程序和部署程序。
對於 Android，可以設定 adb，以便在 adb 伺服器執行時始終轉送連接埠（請參閱 adb reverse）。設定連接埠轉送後，將不再需要外部位址。您也可以透過 TCP 設定 adb 橋接，這樣後續部署就不再需要 USB 電纜。
如果您使用具有 Angular 的開發容器，您可能會看到即時重載無法運作。若要修正此問題，請將 angular.json 中的 projects.app.architect.serve.configurations.development.poll 設定為 1。

即時重載預設會使用 HTTP，這會導致需要安全內容的 Web API (例如 Web Crypto) 失敗。若要建立安全內容，您可以使用 --ssl 引數來使用 HTTPS。

例如，對於 Angular 應用程式，您可以執行以下命令來傳遞憑證和私密金鑰，並透過 HTTPS 服務您的應用程式

ionic capacitor run android --livereload --external --ssl -- --ssl-cert='server.crt' --ssl-key='server.key'

使用自我簽署憑證並確保裝置信任它是個複雜的主題，並在這篇文章中涵蓋。