分享15個實用VSCode插件,快來收藏吧!

分享15個實用VSCode插件,快來收藏吧!

推薦學(xué)習(xí):《vscode教程

visual studio code 是由微軟開發(fā)的一款免費、跨平臺的文本編輯器。它有卓越的性能和豐富的功能。VSCode 也有一個擴展和主題市場,為了幫助大家挑選出值得下載的插件,我們針對性的收集了一些實用、有趣的插件與大家分享。

1. Open-In-Browser

分享15個實用VSCode插件,快來收藏吧!

由于 VSCode 沒有提供直接在瀏覽器中打開文件的內(nèi)置界面,所以此插件在快捷菜單中添加了在默認(rèn)瀏覽器查看文件選項,以及在客戶端(Firefox,Chrome,IE)中打開命令面板選項。

2. Quokka分享15個實用VSCode插件,快來收藏吧!

Quokka 是一個調(diào)試工具插件,能夠根據(jù)你正在編寫的代碼提供實時反饋。它易于配置,并能夠預(yù)覽變量的函數(shù)和計算值結(jié)果。另外,在使用 JSX 或 TypeScript 項目中,它能夠開箱即用。

3. Faker

分享15個實用VSCode插件,快來收藏吧!

使用流行的 JavaScript 庫 – Faker,能夠幫你快速的插入用例數(shù)據(jù)。Faker 可以隨機生成姓名、地址、圖像、電話號碼,或者經(jīng)典的亂數(shù)假文段落,并且每個類別還包含了各種子類別,你可以根據(jù)自身的需求來使用這些數(shù)據(jù)。

4. CSS Peek

分享15個實用VSCode插件,快來收藏吧!

使用此插件,你可以追蹤至樣式表中 CSS 類和 ids 定義的地方。當(dāng)你在 HTML 文件中右鍵單擊選擇器時,選擇“ Go to Definition 和 Peek definition ”選項,它便會給你發(fā)送樣式設(shè)置的 CSS 代碼。

5. HTML Boilerplate

分享15個實用VSCode插件,快來收藏吧!

通過使用 HTML 模版插件,你就擺脫了為 HTML 新文件重新編寫頭部和正文標(biāo)簽的苦惱。你只需在空文件中輸入 html,并按 Tab 鍵,即可生成干凈的文檔結(jié)構(gòu)。

6. Prettier

分享15個實用VSCode插件,快來收藏吧!

Prettier 是目前 Web 開發(fā)中最受歡迎的代碼格式化程序。安裝了這個插件,它就能夠自動應(yīng)用 Prettier,并將整個 JS 和 CSS 文檔快速格式化為統(tǒng)一的代碼樣式。如果你還想使用 ESLint,那么還有個 Prettier – Eslint 插件,你可不要錯過咯

7. Color Info

分享15個實用VSCode插件,快來收藏吧!

這個便捷的插件,將為你提供你在 CSS 中使用顏色的相關(guān)信息。你只需在顏色上懸停光標(biāo),就可以預(yù)覽色塊中色彩模型的(HEX、 RGB、HSL 和 CMYK)相關(guān)信息了。

8. SVG Viewer

分享15個實用VSCode插件,快來收藏吧!

此插件在 Visual Studio 代碼中添加了許多實用的 SVG 程序,你無需離開編輯器,便可以打開 SVG 文件并查看它們。同時,它還包含了用于轉(zhuǎn)換為 PNG 格式和生成數(shù)據(jù) URI 模式的選項。

9. TODO Highlight

分享15個實用VSCode插件,快來收藏吧!

這個插件能夠在你的代碼中標(biāo)記出所有的 TODO 注釋,以便更容易追蹤任何未完成的業(yè)務(wù)。在默認(rèn)的情況下,它會查找 TODO 和 FIXME 關(guān)鍵字。當(dāng)然,你也可以添加自定義表達式。

10. Icon Fonts

分享15個實用VSCode插件,快來收藏吧!

這是一個能夠在項目中添加圖標(biāo)字體的插件。該插件支持超過 20 個熱門的圖標(biāo)集,包括了 Font Awesome、Ionicons、Glyphicons 和 Material Design Icons。

11. Minify

分享15個實用VSCode插件,快來收藏吧!

這是一款用于壓縮合并 JavaScript 和 CSS 文件的應(yīng)用程序。它提供了大量自定義的設(shè)置,以及自動壓縮保存并導(dǎo)出為.min文件的選項。它能夠分別通過 uglify-js、clean-css 和 html-minifier,與 JavaScript、CSS 和 HTML 協(xié)同工作。

12. Change Case

分享15個實用VSCode插件,快來收藏吧!

雖然 VSCode 內(nèi)置了開箱即用的文本轉(zhuǎn)換選項,但其只能進行文本大小寫的轉(zhuǎn)換。而此插件則添加了用于修改文本的更多命名格式,包括駝峰命名、下劃線分隔命名,snake_case 命名以及 CONST_CAS 命名等。

13. Regex Previewer

分享15個實用VSCode插件,快來收藏吧!

這是一個用于實時測試正則表達式的實用工具。它可以將正則表達式模式應(yīng)用在任何打開的文件上,并高亮所有的匹配項。

14. Language and Framework Packs

分享15個實用VSCode插件,快來收藏吧!

VSCode 默認(rèn)支持大量的主流編程語言,但如果你所使用的編程語言不包括在內(nèi),也可以通過下載擴展包來自動添加。同時,你還可以添加一些像 React Native 與Vue 的相關(guān) Web 開發(fā)插件包。

15. Themes

分享15個實用VSCode插件,快來收藏吧!

當(dāng)然,在眾多的實用插件中,豈能少了漂亮的主題呢?你每天都會與你的 VSCode 編輯器進行“親密的接觸”,為何不把它打扮得更漂亮些呢?這里有一些幫助你更改側(cè)邊欄的配色方案,以及圖標(biāo)的相關(guān)主題,與大家分享:

? One Monokai

? Aglia

? One Dark

? Material Icon

更多編程相關(guān)知識,請訪問:vscode教程!!

? 版權(quán)聲明
THE END
喜歡就支持一下吧
點贊11 分享