代碼插件對(duì)于提高編程效率、加快工作速度非常重要。 這里有 30 個(gè)最流行的插件，它們將使您成為更高效的黑客。 這些插件主要面向前端開發(fā)人員，但也有一些通用插件可以適應(yīng)任何開發(fā)環(huán)境。 以下是我將介紹的插件：

同步[1]

直播[2]

SSH[3]

[4]

一對(duì) [5]

自動(dòng)標(biāo)簽[6]

[7]

git [8]

CSS 預(yù)覽[9]

代碼[10]

[11]

Sass/Less//哈巴狗/Jade// Hero Pro[12]

密碼咒語 [13]

調(diào)試器[14]

圖標(biāo)主題[15]

渦輪日志[16]

待辦事項(xiàng)[17]

圖標(biāo)[18]

正則表達(dá)式[19]

[20]

[21]

成本[22]

[23]

[24]

[25]

— 工具[26]

[27]

Vue 3 - 多合一[28]

HTML/CSS/ [29]

/Hero - //Bing/Baidu/Wiki/Yahoo//Npm [30]

同步

同步可以為您節(jié)省大量跨設(shè)備安裝插件的時(shí)間

在開始左右安裝插件之前，最好知道 Sync[31] 的存在。 它允許您同步在 10 上自定義的幾乎所有內(nèi)容，從設(shè)置到鍵盤快捷鍵再到其他插件。

這樣，您就可以從任何您想要的設(shè)備訪問您最喜歡的 IDE，而無需在新設(shè)備上的正常環(huán)境中進(jìn)行編程，也無需再次手動(dòng)設(shè)置所有內(nèi)容。

居住

立即查看瀏覽器中反映的代碼更改

這是我最喜歡的插件之一。 Live [32]啟動(dòng)本地開發(fā)服務(wù)器并提供靜態(tài)和動(dòng)態(tài)頁面的實(shí)時(shí)重新加載功能。

每次保存代碼時(shí)，您都會(huì)立即在瀏覽器中看到反映的更改。 您將更快地發(fā)現(xiàn)錯(cuò)誤，并且可以更輕松地對(duì)代碼進(jìn)行一些快速實(shí)驗(yàn)。

是一款流行的人工智能助手，適用于所有主要編程語言，因此毫無疑問sublime text 插件 php格式化，無論您的技能如何，您都會(huì)發(fā)現(xiàn)它很有用。

通過研究公開共享的代碼庫，使用深度學(xué)習(xí)算法預(yù)測(cè)您的需求，并提供一鍵代碼完成功能，您可以快速高效地完成項(xiàng)目。 對(duì)于新手編碼員來說，這讓學(xué)習(xí)變得輕而易舉，因?yàn)樗鼮槟峁┝税l(fā)揮自己想法的空間sublime text 插件 php格式化，而無需記住編碼語法或搜索。

而且，如果您是一位經(jīng)驗(yàn)豐富的開發(fā)人員，您會(huì)發(fā)現(xiàn)您已獲得運(yùn)行所需的構(gòu)建塊，從而節(jié)省大量工作時(shí)間。

SSH

使用任何帶有 SSH 服務(wù)器的遠(yuǎn)程計(jì)算機(jī)，SSH[33] 插件允許您使用任何帶有 SSH 服務(wù)器的遠(yuǎn)程計(jì)算機(jī)作為開發(fā)環(huán)境。 這使得在各種場(chǎng)景下開發(fā)和/或故障排除變得更加容易。

您也不需要本地計(jì)算機(jī)上的任何源代碼，因?yàn)樵摬寮苯釉谶h(yuǎn)程計(jì)算機(jī)上運(yùn)行命令和其他插件。

花更少的時(shí)間格式化代碼

[34] 是一個(gè)固執(zhí)己見的代碼格式化程序，如果您有多個(gè)人在一個(gè)項(xiàng)目上工作，那么它特別有效，因?yàn)樵摬寮?qiáng)制執(zhí)行一致的風(fēng)格。

您可以將其設(shè)置為每次保存代碼時(shí)都對(duì)其進(jìn)行格式化，從而顯著減少格式化代碼所花費(fèi)的時(shí)間。

一對(duì)

每個(gè)人都喜歡用顏色編碼，Pair[35]為左右括號(hào)提供了匹配的顏色，可以更容易地知道哪些括號(hào)屬于誰。

還可以配置自定義括號(hào)字符，并且您可以向活動(dòng)范圍添加背景顏色。

自動(dòng)標(biāo)記

自動(dòng)重命名標(biāo)簽，雖然本質(zhì)上會(huì)突出顯示匹配標(biāo)簽并在您鍵入開始標(biāo)簽后立即添加結(jié)束標(biāo)簽，但自動(dòng)重命名標(biāo)簽插件 [36] 會(huì)自動(dòng)重命名您更改的標(biāo)簽。

該插件適用于 HTML、XML、PHP，無需兩次更改標(biāo)簽名稱。

增強(qiáng)您的 Git 功能 代碼的 Git 功能已增強(qiáng) [37]。 這是一個(gè)功能強(qiáng)大的插件，可以讓您查看代碼行隨時(shí)間變化的人、原因和方式，以及許多其他功能。

它是一個(gè)高度可定制的插件。 如果您不喜歡某個(gè)特定設(shè)置，可以在設(shè)置中輕松將其關(guān)閉。

git

獲取git日志并以良好的視覺效果顯示它們

同樣，Git [38] 是一個(gè)提供 git 日志可視化的插件。 您不需要在終端中查看 git 日志。

插件也非常全面。 它允許您比較分支、提交和跨提交的文件。 您還可以檢查您的頭像，這非常整潔。

Vue 3 - 多合一

這是一個(gè)在Vue 2或Vue 3開發(fā)中提供代碼片段、語法高亮和格式化的插件，可以大大提高你的開發(fā)效率。 您可以打開編輯器底欄右下角的 Auto Vue 開關(guān)。 它可以幫助您在保存代碼時(shí)自動(dòng)格式化 vue 文件。 默認(rèn)情況下它是關(guān)閉的。

如果不想自動(dòng)格式化vue文件，也可以右鍵vue文件，在出現(xiàn)的菜單欄中選擇一個(gè)菜單項(xiàng)，文件就會(huì)被格式化一次。

CSS 預(yù)覽

插入 HTML 文件以查看 CSS 代碼

這個(gè)插件對(duì)于前端開發(fā)人員來說是無價(jià)的。 受到 IDE 中類似功能的啟發(fā)，CSS Peek [39] 允許您插入 HTML 和 ejs 文件以在源代碼中顯示 CSS/SCSS/LESS 代碼。

如果您知道類或 ID 名稱，它還允許您快速跳轉(zhuǎn)到相應(yīng)的 CSS 代碼。

代碼

提供了許多 JS 代碼片段提示，雖然包含了內(nèi)置 JS，但 JS 片段插件 [40] 通過添加大量導(dǎo)入和導(dǎo)出觸發(fā)器、類幫助器和方法觸發(fā)器來增強(qiáng)這種體驗(yàn)。

該插件支持 JS、JS React、TS React、HTML 和 Vue。 其他樣式的代碼片段（例如）也可以在.

HTML/CSS/

只需輸入前綴名稱，完整的代碼片段就會(huì)自動(dòng)補(bǔ)全。

/Hero - //Bing/Baidu/Wiki/Yahoo//Npm

一個(gè)可讓您搜索或翻譯代碼的插件。 您可以在編輯器中的代碼中選擇相應(yīng)的關(guān)鍵字，然后單擊鼠標(biāo)右鍵，在出現(xiàn)的菜單面板中選擇菜單項(xiàng)。 插件會(huì)自動(dòng)為您打開默認(rèn)瀏覽器，搜索相應(yīng)的關(guān)鍵詞并顯示搜索結(jié)果。 。

您也可以選擇相應(yīng)的關(guān)鍵詞，使用快捷鍵打開瀏覽器進(jìn)行搜索。

更改實(shí)例的顏色非常有用。 [41]允許您更改代碼環(huán)境的顏色，以便您可以快速識(shí)別剛剛切換到的實(shí)例。

查看您在樣式指南中使用的顏色，并使用 [42] 立即可視化 CSS/SASS/Less/... 文件中的 CSS 顏色。 這使得您可以很容易地一眼看出您在哪里使用了哪些顏色。

代碼拼寫

讓你的代碼不再有拼寫錯(cuò)誤。 盡管拼寫錯(cuò)誤不是致命問題，但我更希望我的代碼沒有拼寫錯(cuò)誤。 Code Spell 插件 [43] 在其字典文件中為無法識(shí)別的單詞添加下劃線。

該插件提供多種不同語言版本，并支持醫(yī)學(xué)術(shù)語等行話。

為了

在 中調(diào)試你的 JS 代碼，由 for [44] 開發(fā)，允許你在 . 與其他IDE中的調(diào)試器相反，它非常流暢。

您可以設(shè)置斷點(diǎn)、單步調(diào)試代碼、調(diào)試動(dòng)態(tài)添加的腳本等等。

圖標(biāo)字體

提供各種圖標(biāo)供您使用！ Icon Fonts[45]提供了各種圖標(biāo)字體的片段，包括流行的Font v5圖標(biāo)包。

對(duì)于那些不這樣做的人，這個(gè)包也適用于 Atom 和 Text。

渦輪日志

自動(dòng)創(chuàng)建有意義的日志消息，控制臺(tái)顯示日志[46]\\插件的進(jìn)程自動(dòng)創(chuàng)建有意義的日志消息。 它使調(diào)試變得更加容易，因?yàn)槟鷮@得一些有用的控制臺(tái)輸出來找出問題所在。

去做

立即在代碼中發(fā)現(xiàn) TODO。 許多程序員都有在代碼中編寫 TODO 的習(xí)慣，然后完全忘記它們。 Todo [47]使它們更加突出。

您可以切換突出顯示或列出所有突出顯示的注釋并從相應(yīng)的文件中顯示它們。

圖標(biāo)

等等，不是每個(gè)人都喜歡圖標(biāo)嗎？ 你不會(huì)認(rèn)為這些圖標(biāo)有很大的不同，但至少對(duì)我來說是這樣。 Icons[48] 為您的 IDE 添加了絢麗的色彩和可愛的小圖標(biāo)，我已經(jīng)愛上了它。

正則表達(dá)式

創(chuàng)建正則表達(dá)式的預(yù)覽。 正則表達(dá)式可能是一個(gè)難題。 Regex [49] 為您提供與正則表達(dá)式匹配的輔助文檔。

該插件提供了多個(gè)匹配示例，因此可以更輕松地針對(duì)各種用例快速準(zhǔn)確地編寫正則表達(dá)式。

為您的代碼添加書簽，盡管帶有行號(hào)，[50] 允許您為代碼添加書簽，幫助您快速導(dǎo)航并輕松地來回跳轉(zhuǎn)。

成本

當(dāng)您開發(fā) Web 應(yīng)用程序或網(wǎng)站時(shí)，很容易做出一些臃腫的東西 - 尤其是作為新手開發(fā)人員。 其中一個(gè)重要因素是，許多開發(fā)人員在通過代碼導(dǎo)入包時(shí)并不總是知道包有多大。

Cost 是一個(gè)擴(kuò)展，可以內(nèi)聯(lián)顯示導(dǎo)入的包的大小，因此您可以準(zhǔn)確地知道在開發(fā)過程中導(dǎo)入該包的成本是多少。 因此，它將幫助您更好地優(yōu)化您的應(yīng)用程序和網(wǎng)站，特別是對(duì)于通常更容易遭受臃腫困擾的移動(dòng)用戶。

如果您選擇的語言是 .js 或 .js，您一定會(huì)喜歡 . 此擴(kuò)展旨在通過在編寫代碼時(shí)在 IDE 中顯示運(yùn)行時(shí)值來加速開發(fā)，因此您可以專注于編寫代碼，而不是僅僅為了嘗試新事物而構(gòu)建自定義配置。

這是一個(gè)簡(jiǎn)單、輕量級(jí)的擴(kuò)展，非常適合經(jīng)驗(yàn)豐富的開發(fā)人員和新手。 它也免費(fèi)供社區(qū)使用，但如果您是專家，您還可以購買 Pro 許可證，它允許您修改運(yùn)行時(shí)值而不更改代碼。

如果您需要格式化程序和標(biāo)準(zhǔn)化代碼，那么這個(gè)插件適合您。 它可以自動(dòng)格式化您的代碼并查找代碼中的錯(cuò)誤。

此外，它允許您在添加書簽的代碼之間選擇代碼區(qū)域，這對(duì)于日志文件分析等很有用。

它旨在幫助開發(fā)人員和程序員提供智能代碼完成建議。 默認(rèn)支持，/，React 和 Java。

- 工具

通過管理數(shù)據(jù)庫的工具。 它支持許多驅(qū)動(dòng)程序，您可以使用它來做很多事情，例如連接到資源管理器、查詢運(yùn)行器、智能感知、書簽、查詢歷史記錄。

該擴(kuò)展將幫助您在代碼中創(chuàng)建更多用戶友好的注釋。 每種顏色都可以用來表示評(píng)論類型（注釋、待辦事項(xiàng)等）。

終于

這里有我親自介紹的30個(gè)插件，可以在不影響質(zhì)量的情況下提高你的編程效率。 ，如果文章和筆記能給您帶來一些幫助或啟發(fā)，請(qǐng)不要吝嗇您的喜歡和收藏。 文章將持續(xù)同步更新。 之前的文章也包含在.com//CV[51]中。 歡迎您的關(guān)注和交流。 你們的絕對(duì)是我前進(jìn)的最大動(dòng)力

如有侵權(quán)請(qǐng)聯(lián)系刪除！