從給Vite2官方提了一個issues并已被認可為Bug，我學到了什么？
緣起
我打算使用自己搭建的V3項目腳手架parcel-vue-app搞一搞項目，畢竟是剛出來，很多東西都不完善，只能自己不斷嘗試。于是，使用parcel-vue-cli開始初始化項目(如果有小伙伴對parcel-vue-app感興趣的，文末有源碼地址)。
...項目搭建完畢
啟動地址是http://localhost:3000/，一頓操作之后，頁面也能很快地更新數據。不得不覺得Parcel在這方面做得還是很不錯的。于是這時，想到了尤大大開發的Vite，決定比較一下。于是進入vite官方網站，下載了vite@2.3.0，選擇的是vue模板。這時，根據提示進入項目目錄，然后運行yarn dev命令啟動項目。一眨眼的功夫就啟動起來，不得不說太厲害了。這時，我看到了這行綠字http://localhost:3000/，什么?給我第一感覺是vite難道沒有占用端口號檢測機制，不會吧!不敢相信的我開始找vite官網的配置。我在vite.config.js文件中添加了這幾行代碼。
- import { defineConfig } from 'vite';
- import vue from '@vitejs/plugin-vue';
- // https://vitejs.dev/config/
- export default defineConfig({
- plugins: [vue()],
- server: {
- port: 3000,
- strictPort: true,
- },
- });
我指定服務器端口。官方也說了如果端口已經被使用，Vite 會自動嘗試下一個可用的端口。另外我還不放心strictPort設為true，這樣若端口已被占用則會直接退出，而不是嘗試下一個可用端口。這應該好了吧!于是，我關閉vite項目，重啟了下，我看到了下面這幅圖。
于是，我還是不死心，我先關閉parcel項目，又關閉了vite項目。
決定從頭開始，首先我打開了之前創建的的vite項目。之前vite項目的版本是2.0.4，我心想版本不一樣應該不會有事，于是我又興致勃勃地啟動了vite@2.0.4項目，端口號是3000，接著我又啟動了vite@2.3.0項目(實際是2.3.1，package.json與node_modules版本不一致，這里暫且忽略)，接著就發生了下面這種事。
當時的感覺就是，這種事怎么讓我遇到了。我還是不死心，我試試VueCLI跟Vite對比一下。
Vite項目這里使用的是vite@2.3.0，結果發現，vite可以檢測到，并且成功阻止了。
接著，我又創建了一個vite@2.3.0項目，打算看下相同版本的項目會不會出現這種情況。
然后，我又啟動了一個vite@2.0.5的項目，發現并不是我們預想到的3002端口，還是3000端口。于是我覺得入坑了~，這里可能是之前vite遺留的bug，現在的新版本解決了。
解決完一個疑惑，但是最初那個疑惑還沒有解決。就是啟動parcel2項目，vite項目(vite@2.3.0)檢測不到parcel2已占用端口。
于是，就去github上提了一個issues。
https://github.com/vitejs/vite/issues/3391
緣落
提了一個issues，回復非常快，并且已確認Bug。給vite團隊點贊!
以下是回復內容：
回復1：
Looks like parcel is listening to all address (as --host ::). Vite 2.3 switched the default to listen only to 127.0.0.1, so there isn't an error when listening to it in the same port.
If you use --host or --host :: in vite, you will get the same behavior as with 2.2 and it will fail as you expect. You could also set parcel to listen to --host 127.0.0.1 and also get a hard error.
I don't know if there is something that should be fixed in Vite regarding this. Other tools like sirv-cli also work in the same way, and will not recognize that 3000 is being used in this case.
翻譯為：
看起來parcel2正在偵聽所有地址(如--host：:)。Vite 2.3將默認設置切換為僅偵聽127.0.0.1，因此在同一端口中偵聽它時沒有錯誤。
如果在vite中使用--host或--host ::，將獲得與2.2相同的行為，并且將按預期失敗。您還可以將parcel2設置為偵聽--host 127.0.0.1，并且還會收到硬錯誤。
我不知道Vite是否應該對此進行修復。諸如sirv-cli之類的其他工具也以相同的方式工作，在這種情況下將無法識別使用了3000。
回復2：
related to the port-reuse issue of node.
@maomincoding you can specified server.host to '::' as a temporay workaround.
Since 1e604d5b60900098f201f90394445fea55642e74, httpServer will listen to a specified default host caused this issue.
翻譯為：
涉及到節點的端口重用問題。
@maomincoding可以將server.host指定為“：：”作為臨時解決方法。
由于1e604d5b60900098f201f90394445fea55642e74，httpServer將偵聽導致此問題的指定默認主機。
https://github.com/vitejs/vite/commit/1e604d5b60900098f201f90394445fea55642e74
https://stackoverflow.com/questions/60217071/node-js-server-listens-to-the-same-port-on-0-0-0-0-and-localhost-without-error
有了以上兩個回復，我暫且在parcel項目中使用--host 127.0.0.1解決了問題。
并且，我又對parcel-vue-app進行了更新，最新版本v1.0.6。也謝謝有了這次經歷，讓自己的工具越來越好。
其實，不光以上兩個回復，還有第三個回復。
回復3
For the future, please do not ping Evan directly.
We have an active team around Vite that is working / triaging issues and PRs every day and we decide what is needed to reach Evan so he can manage higher order stuff in the whole Vue ecosystem.
翻譯為：
以后，請不要直接聯系Evan。
我們在Vite周圍有一個活躍的團隊，每天都在工作/分類問題和PRs，我們決定需要什么來聯系Evan，這樣他就可以在整個Vue生態系統中管理更高層次的東西。
以下是我回復的話：
Sorry, it won't happen again.
我算是前車之鑒了，大家以后提issues的時候就不要跟我一樣艾特尤大大。
......
總結
學好英語很重要!!!我大部分都是用谷歌翻譯~
要不斷鉆研，說不定你會學到很多東西。
還要懂得不要打擾別人，我就是個反面教材。
