在開發Web應用時，我們通常會使用Vue來構建數據驅動的前端頁面，而Vue CLI則是一個專業的工具鏈，用于快速構建Vue項目。Vue CLI除了提供默認的配置和應用模板以外，還提供了很多有用的功能，例如更改端口。如果我們希望在開發模式下更改Vue CLI的默認端口，可以按照以下步驟進行操作。

首先，我們需要打開Vue CLI項目中的根目錄，在命令行中輸入"npm run serve"，啟動開發服務器。這時，開發服務器默認監聽localhost:8080端口。

// 代碼示例
npm run serve

如果我們希望更改默認端口，可以在命令后面添加"--port"參數，以指定一個端口號。例如，如果我們想要將端口號更改為3000，可以使用以下命令：

// 代碼示例
npm run serve -- --port 3000

這樣，開發服務器將會監聽localhost:3000端口。如果想要監聽某個不被占用的端口，可以使用"--host"參數，以指定一個IP地址。

// 代碼示例
npm run serve -- --host 192.168.1.1

除了使用命令行參數，我們還可以在項目中的vue.config.js文件中進行配置。在這個文件中，我們可以添加一個對象，以指定開發服務器的選項。例如，我們可以在這個對象中添加一個port屬性，以改變端口號。

// 代碼示例
module.exports = {
devServer: {
port: 3000
}
}

這樣，在啟動開發服務器時，Vue CLI將會從vue.config.js文件讀取我們指定的端口號。如果vue.config.js文件不存在，我們需要手動創建這個文件，并將它放置在項目的根目錄下。

除了上述方法以外，我們還可以使用環境變量來更改端口號。在命令行中，可以使用"set"命令或"export"命令來設置一個名為"PORT"的環境變量。

// 代碼示例
set PORT=3000
export PORT=3000

在設置完環境變量之后，我們需要重新啟動開發服務器。這時，Vue CLI將會從環境變量中讀取端口號。這種方法適用于需要在不同的環境中使用不同的端口號的場景。

總之，Vue CLI提供了多種方式來更改端口號，我們可以根據不同的需求來選擇不同的方法。在開發Web應用時，更改端口號是一個非常常見的需求，Vue CLI可以很好地滿足這個需求，并且提供了多種有用的功能，讓我們的前端開發更加高效、便捷。