所有插件查找地址（https://marketplace.visualstudio.com/）

編碼快捷方式（http://docs.emmet.io/cheat-sheet/）

安裝插件出現(xiàn)??錯(cuò)誤unable?to?verify?the?first?certificate （無(wú)法確認(rèn)第一證書）　　

　　解決方法如下：　　

　　在vscode 下 進(jìn)入 文件->首選項(xiàng)-->設(shè)置 在上面的搜索框輸入 proxy,會(huì)出現(xiàn) 有3個(gè)相關(guān)設(shè)置項(xiàng)，設(shè)置如下的選項(xiàng)?

　　

?

// 是否應(yīng)根據(jù)提供的 CA 列表驗(yàn)證代理服務(wù)器證書。"http.proxyStrictSSL": true, //設(shè)置為false , 這時(shí)候會(huì)在右側(cè)的自定義設(shè)置中增加一條"http.proxyStrictSSL": false,

?

?

　　　　重啟 VScode ，然后在安裝插件，會(huì)發(fā)現(xiàn)神奇的可以安裝了。

插件

1、HTML Snippets

　　超級(jí)使用且初級(jí)的H5代碼片段以及提示

2、HTML CSS Support?

　　讓HTML標(biāo)簽上寫class智能提示當(dāng)前項(xiàng)目所支持的樣式

3、jQuery Code Snippets

　　jQuery 提示工具

4、Path Intellisense

　　路徑提示補(bǔ)全

5、Document this

　　Js的注釋模板

6、ESlint

　　ESlint接管原聲js提示，可以自定制體會(huì)規(guī)則?

7、Auto Close Tag

　　自動(dòng)補(bǔ)全html標(biāo)簽

8、Auto Rename Tag

　　修改html標(biāo)簽，自動(dòng)幫你完成尾部閉合標(biāo)簽的同步修改

9、默認(rèn)瀏覽器查看HTML文件

　　Open In Browser?（快捷鍵Alt+B可以修改）

　　View InBrowser?（快捷鍵Ctrl+F1可以修改）

　

10、beautify

　　格式化代碼的工具

11、Rainbow Brackets

　　彩虹括號(hào)（不推薦用）

12、Guides（新版已經(jīng)包含）

　　標(biāo)簽對(duì)其線

13、Project Manager

　　在多個(gè)項(xiàng)目之前快速切換的工具

14、vscode-icons

　　讓 vscode 資源樹目錄加上圖標(biāo)；點(diǎn)擊設(shè)置->如圖：

　　

15、background

　　可以讓vscode的背景修改為自己喜歡的圖，最多3張照片

　　https://marketplace.visualstudio.com/items?itemName=shalldie.background

　　圖片配置

?

// Plugin background enabled.background 插件是否啟用 "background.enabled": false,// Use default images.使用默認(rèn)圖片 "background.useDefault": false,// Your custom Images(Max length is 3). 自己定制背景圖，最多3個(gè) "background.customImages": ["file:///E:/wushen.png","file:///E:/wushen.png","file:///E:/wushen.png" ]

?

　　

16、markdownlint

　　Markdown格式提示

　　可以通過(guò)快捷鍵 Ctrl+Shift+V來(lái)預(yù)覽最終的顯示效果

17 、Atom Keymap

　　在安裝這個(gè)插件并重啟 VS Code 之后，將使你的 VS Code 中可以使用 Atom 的鍵盤快捷鍵。

18、Sublime Text Keymap and Settings Importer

　　在安裝這個(gè)插件和重啟 VS Code 之后，將在 VS Code 中導(dǎo)入 Sublime Text 的鍵盤快捷鍵。可以通過(guò) VS Code 的強(qiáng)大智能感知來(lái)使用熟悉的 Sublime Text 鍵盤快捷鍵。

?19、 JavaScript (ES6) code snippets

　　用代碼片段加快 ES6 開(kāi)發(fā)速度，例如輸入 imd 可以自動(dòng)生成如下代碼：

?20、 Document This

　　在 TypeScript 和 JavaScript 文件中自動(dòng)生成詳細(xì)的 JSDoc 注釋

?

?

vsCode配置

// 控制是否顯示 minimap(縮略圖)"editor.minimap.enabled": true,// 視區(qū)寬度自動(dòng)換行設(shè)置。"editor.wordWrap": "on",// 指定用在工作臺(tái)中的顏色主題。"workbench.colorTheme": "Monokai",

　　

轉(zhuǎn)載于:https://www.cnblogs.com/tlf01/p/6297365.html

總結(jié)

以上是生活随笔為你收集整理的VS Code 使用小技巧的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。