Vue CLI 是一個幫助開發者快速構建 Vue.js 應用的腳手架工具。它提供了一套豐富的插件系統，可以輕松地實現 開發、測試 和 部署等流程。在部署 Vue CLI 應用時，很多情況下需要使用 HTTPS 協議來保證數據的安全傳輸。本文將會詳細介紹在 Vue CLI 應用中部署 HTTPS 的過程。 首先，在將 Vue CLI 應用部署到 HTTPS 上之前，需要在服務器上配置 SSL 證書。SSL 證書是一種由第三方認證機構頒發的數字證書，用于加密傳輸 HTTP 協議數據。配置 SSL 證書可以使用自簽名證書或者購買商業 SSL 證書來實現。自簽名證書用來進行測試和開發，而商業 SSL 證書則需要向證書頒發機構購買。 配置好 SSL 證書之后，下一步是修改 Vue CLI 應用的配置文件。打開 vue.config.js 文件，在其中添加如下配置： ``` devServer: { https: true } ``` 這樣就完成了在 development 模式下啟用 HTTPS 的設置。注意，這個配置并不會在生產環境下運行。要在生產環境下啟用 HTTPS，還需要進行其他的配置。 打開 package.json 文件，找到如下配置： ``` "scripts": { "serve": "vue-cli-service serve" } ``` 在這個配置中，我們可以看到 serve 命令是用來啟動開發服務器的。要在生產環境下啟用 HTTPS，我們可以在這個命令后面添加一個參數： ``` "scripts": { "serve": "vue-cli-service serve", "build:prod": "vue-cli-service build", "start:prod": "serve -s dist --ssl --port 443" } ``` 在生產環境下啟用 HTTPS 的關鍵在于添加了 --ssl 參數。這會讓 serve 命令使用 HTTPS 協議啟動服務器。 最后，運行 build:prod 命令將 Vue CLI 應用構建成靜態文件，在生產環境下啟用 HTTPS： ``` npm run build:prod npm run start:prod ``` 這樣就完成了在 Vue CLI 應用中部署 HTTPS 的全部過程。在 HTTPS 環境下運行 Vue CLI 應用，可以確保數據傳輸的安全性，提高用戶體驗和網站的安全性。