大家好，我是林三心，用最通俗易懂的話講最難的知識點是我的座右銘，基礎是進階的前提是我的初心~gM228資訊網——每日最新資訊28at.com

背景

是這樣的，前幾天我們小組在上線某一個平臺的時候，上線后，發現了一個生產 BUG ，大家都心急如焚，然后找到了代碼原因后，組員進行了代碼修改，然后讓老大進行部署上線gM228資訊網——每日最新資訊28at.com

部署完后，發現了這個生產 BUG 還是存在！！！關掉緩存刷新、重啟，這些都試過了，還是存在問題，這個時候大家都很疑惑：gM228資訊網——每日最新資訊28at.com

• 部署成功了，為啥還有這個生產 BUG？
• 難道是 CICD 上提示部署成功，實際上沒部署成功？
• 或者是部署成功了，但是代碼依舊有問題？

總之就是一個問題：到底部署成功了沒？gM228資訊網——每日最新資訊28at.com

后面發現其實是沒部署成功，雖然 CICD 上提示成功了，但是最后部署錯鏡像了，導致問題依舊存在gM228資訊網——每日最新資訊28at.com

這件事情之后，我覺得應該搞個信息，每次上線的時候這個信息都能帶到網頁上去，這樣我們就知道網頁的代碼到底是不是最新的了！！！gM228資訊網——每日最新資訊28at.com

那應該帶什么信息呢？其實帶 Git 信息就可以了！！！比如：gM228資訊網——每日最新資訊28at.com

• 當前 Git 的最后一次提交 hash
• 當前 Git 的最后一次提交 時間
• 等等

只要帶上這些信息，就可以在部署后遇到問題的時候，能指導到底是不是部署成功了！gM228資訊網——每日最新資訊28at.com

小練習

在做這個插件之前，先給大家一個小練習，咱們寫一個 vite 插件，這個插件的作用是，在打包的時候，給 widnow 加一個變量gM228資訊網——每日最新資訊28at.com

transformIndexHtml 是插件的一個鉤子函數，可以在這個函數中去定義你想要塞哪些東西到 index.html 中gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

思路其實很簡單，就是在 head 下新增一個 script 標簽，內容是：window.constant = 2gM228資訊網——每日最新資訊28at.com

接著在 vite.config.ts 中引入插件，并使用gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

然后啟動頁面，我們可以看到 head 標簽下，出現了一個 script 標簽，這個標簽就是我們新增上去的gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

現在我們到控制臺，看看能不能獲取到 constant 這個全局變量，發現是可以獲取到的gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

舉一反三

思路有了，其實想要加一些 Git 信息到網頁上也不難了，無非就是通過調用命令行，把一些 Git 信息加到 window 下gM228資訊網——每日最新資訊28at.com

先看一下我最新的一條 Git 提交，現在的任務就是把這個提交的一些信息，加到 window 下gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

插件的代碼如下，代碼量非常的少，有了這個插件，以后就不用再去猜到底部署成功沒了~gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

圖片gM228資訊網——每日最新資訊28at.com

圖片 gM228資訊網——每日最新資訊28at.com

本文鏈接：http://www.www897cc.com/showinfo-26-70400-0.html項目明明部署成功了， BUG 怎么還在啊？產品急了

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com

上一篇： 雙異步系列完結撒花，如何解決異步事務問題？

下一篇： Spring MVC核心擴展點及使用技巧總結和使用案例