vscode好用的擴展及常用的快捷鍵


1、open-in-browser 或者view in browser  安裝后右鍵即可快速打開瀏覽器

2、quokka調試工具插件,能對正在編寫的代碼提供實時反饋,並能預覽變量的函數和計算結果

3、faker 流行的js庫,能快速插入用例數據。

4、css peek 在HTML文件中右鍵單擊選擇器可快速到指定的css樣式

5、html boilerplate快速創建html的頭部,只需輸入html並按tab鍵

6、prettier 在Ctrl+shift+p命令面板里輸入format即可格式化代碼

7、color info 在顏色光標上懸停即可出現色彩模型

8、svg viewer 可以打開svg文件並查看,還可轉換為png格式和生成數據url模式

9、TODO highlight 在面板輸入TODO即可快速定位到TODO和FIXME關鍵字

10、icon fonts

11、Minify 面板輸入minify即可壓縮合並js和css文件並保存為.min文件

12、change case修改文本命名格式,面板輸入 camel 即可。包括駝峰命名、下划線分隔命名,snake_case 命名以及 CONST_CAS 命名等

13、Regex Previewer實時測試正則表達式的使用工具,它可以將正則表達式模式應用在任何打開的文件上,並高亮所有的匹配項。

14、beautify 是html,css,scss,js格式化 

15、html snippets 是h5代碼片段及提示

16、html css  support 支持scss文件檢索,提示class所支持的樣式

17、jquery code snippets 

18、path intellisense自動路徑補全

19、debugger for chrome 讓vscode 映射chrome的debug功能,靜態頁面也可以用vscode來打斷點。

20、sass 語法高亮,自動提示功能

21、easy sass自動編譯sass/scss文件,生成.css和.min.css后綴文件

22、auto close tag 自動補全標簽

23、vue2 snippets 代碼提示高亮

24、scss IntelliSense   SCSS智能提醒,配置強大

快捷鍵:

格式化代碼 :       alt+shift+f  或者 ctrl+shift+p后輸入format

命令面板:           ctrl+shift+p

查找                       Ctrl +f

查找替換              ctrl +h

整個文件夾查找 shift+ctrl+f

側邊欄顯/隱         Ctrl+b

代碼縮進             ctrl+[,ctrl+]

轉到行首和行尾  Home 和 End

在下面插入一行 Ctrl + enter

在上面插入一行 Ctrl + shift +enter

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM