Categories
程式開發

VSCode最強助攻


VSCode最強助攻

VS Code是前端界必備的開發工具。頁面仔小楊簡單介紹幾款高效、好用的插件,讓原本單薄的VS Code如虎添翼,開發效率倍增。

vscode-icons

VSCode最強助攻 1

vscode-icons不僅能夠給文件夾、文件添加上舒適的圖標,而且可以自動檢測項目,根據項目不同功能配上不同圖標,例如,git、Markdown、配置項、工具類等

Better Comments

VSCode最強助攻 2

一款讓註釋會說話的插件,註釋前加 * ! ? todo // 就可以顯示不同的樣式

VSCode最強助攻 3

HTML Snippets

VSCode最強助攻 4

代碼自動填充,讓你編程飛起來

Auto Close Tag

VSCode最強助攻 5

自動添加HTML / XML關閉標籤,對前端小伙伴伴兒們相當友好

Auto Rename Tag

VSCode最強助攻 6

自動修改對應的標籤

Trailing Spaces

VSCode最強助攻 7

結尾空格高亮顯示,可以手動刪除或配置快捷鍵刪除

ESLint

VSCode最強助攻 8

EsLint可以幫助我們檢查Javascript編程時的語法錯誤。比如:在Javascript應用中,你很難找到你遺漏的變量或者方法。 EsLint能夠幫助我們分析JS代碼,找到bug並確保一定程度的JS語法書寫的正確性

Prettier – Code formatter

VSCode最強助攻 9

在vs code -> settings中設置,在保存文件時vscode會自動優化代碼

VSCode最強助攻 10

Bracket Pair Colorizer

VSCode最強助攻 11

這個插件能夠快速地找到大括號的另一半,特別是在閱讀別人的代碼時,有利於快速理解

Color Info

VSCode最強助攻 12

在顏色光標上懸停即可出現色彩模型,並且點擊顏色值可更換樣式值格式。

還有許多優秀的插件如codelf、Vetur、minapp、Simple React Snippets、Live Server等,靈活運用這些插件,讓自己的開發效率和質量更上一個台階。

關注公眾號: 頁面仔小楊 【實戰乾貨、原創分享】