1. Color Highlight

誰能記住所有十六進制代碼?反正我是記不住的。

VSCode 為我們提供了一個小顏色框作為參考，但它還不夠大，無法判斷相似顏色之間的差異。Color Highlight 通過用顏色包裝每個十六進制代碼為我們提供了更大的預(yù)覽。

地址：https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight

2. SVG Preview

VS Code 具有一個內(nèi)置的圖像預(yù)覽窗口，但是當(dāng)你單擊.svg文件時，它僅顯示代碼。

借助 「SVG Preview」，我們會獲得一個附加的側(cè)窗，可以預(yù)覽圖像，甚至可以在更改SVG代碼時進行更新。

地址：https://marketplace.visualstudio.com/items?itemName=SimonSiefke.svg-preview

3. i18n Ally

幾個月前，我開始使用i18n，不得不說它使我的網(wǎng)絡(luò)應(yīng)用本地化為多種語言變得異常容易。唯一的困難是，無法在實際處理的文件中編輯翻譯。

相反，必須打開locales/language.json文件，向下滾動到正確的位置，然后在此處編輯文本(到那時我們已經(jīng)忘記了要查找的內(nèi)容)。

「i18n Ally」為我們提供了基本語言文本的內(nèi)聯(lián)預(yù)覽，允許咱們創(chuàng)建新鍵，查看現(xiàn)有鍵，并直接從模板中編輯它們。

地址：https://marketplace.visualstudio.com/items?itemName=antfu.i18n-ally

i18n Ally還附帶了一個漂亮的側(cè)邊欄顯示(上)，它向我們顯示完成項目本地化的距離。

4. Code Spell Checker

「Code Spell Checker」 強烈推薦，對大部分非英語母語又不想寫出四不像變量名的程序員來說，正確識記拼寫各種單詞還是有不小的挑戰(zhàn)，比模棱兩可時需要去查在線詞典不同的是，這款插件能實時的識別單詞拼寫是否有誤，并給出提示，不少 bug 都是因為拼寫錯誤導(dǎo)致的。

地址：https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker

5. JavaScript Booster

「JavaScript Booster」 ：一個非常棒的重構(gòu)工具，比如將var替換為const或let，移除無用的else語句，將變量聲明和變量初始化合并。應(yīng)該說很大程度上受到 「Webstorm」 的啟發(fā)。

地址：https://marketplace.visualstudio.com/items?itemName=sburg.vscode-javascript-booster

還有一個額外必要擴展!

VS Code Icons

當(dāng)前有超過四百萬的用戶，你可能已經(jīng)在使用此功能，這就是為什么它在此列表中具有很高的優(yōu)勢。

如果你沒有，現(xiàn)在就安裝它，讓你在長長的文件和文件夾列表中找到你要找的東西的速度快十倍。它為每種文件類型添加的獨特圖標使文件搜索變得直觀而簡單。

寫在最后，希望這5個擴展能對你有所幫助。