vscode 插件 与 技巧

lit-html
下载量：3 万
在 JavaScript/TypeScript 的文件中，如果有使用到 HTML 标记，lit-html 提供语法高亮和相应的补全支持。Git History
下载量：332 万
用来查看 git log 或则一个文件的 git 历史，比较不同的分支，commits。npm
下载量：119万
npm插件可以检查package.json中所定义的npm模块与实际安装的npm模块是否一致：
package.json中定义了，但是实际未安装
package.json中未定义，但是实际安装了
package.json中定义的版本与实际安装的版本不一致npm Intellisense
下载量：88 万
VSCode 插件可以在导入语句自动补全 npm 模块名称。Bracket Pair Colorizer
下载量：95万
Bracket Pair Colorizer可以为代码中的匹配的括号自动着色，以不同的颜色进行区分，这样我们可以轻易地辨别某个代码块的开始与结束。

1.jQuery Code Snippets -- jQuery 的代码段.
2.C# Outline -- 给C#所有{}代码块加折叠功能.
3.lnline color picker 多种语言代码中的颜色代码直接显示对应的颜色, 直观方便.
4.productivty power tools 功能大全 双击选择某个词后自动高亮整个代码里同样的词.
5.Viasfora -- 很实用的关键字高亮和彩虹括号, 能让代码看起来非常舒心.

2. 字符补全( ♥ 为常用项 )
+ ♥多项：* , 缩写：ul>li*5
css
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul> + ♥Class类：. , 缩写：div.top*2（Class类可以多次使用）
css
<div class="top"></div>
<div class="top"></div> 缩写：p.class1.class2.class3
css
<p class="class1 class2 class3"></p> + ♥Id类：# , 缩写：div#top(一个Id类只能使用一次)
css
<div id="top"></div> 缩写：form#search.wide
css
<form id="search" class="wide"></form> + ♥自增符号：$ , 缩写：ul>li.item$*5
css
<ul>
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>
<li class="item4"></li>
<li class="item5"></li>
</ul> + ♥子元素：> , 缩写： nav>ul>li
css
<nav>
<ul>
<li></li>
</ul>
</nav> + ♥兄弟元素：+ , 缩写：div+div >p> span+em
css
<div></div>
<div>
<p><span></span><em></em></p>
</div> + 自定义属性：[]
缩写：p[title=”Hello world”]
css
<p title="Hello world"></p> 缩写：td[rowspan=2 colspan=3 title]
css
<td rowspan="2" colspan="3" title=""></td> 缩写：[a=’value1’ b=”value2”](a,b为属性，value为属性值。具体使用见上面的例子)
css
<div a="value1" b="value2"></div> + 文本：{}
缩写：a{Click me}
css
<a href="">Click me</a>

{
"Print to console": {
"prefix": "vue",
"body": [
"<!-- $0 -->",
"<template>",
" <div></div>",
"</template>",
"",
"<script>",
"export default {",
" data () {",
" return {",
" }",
" },",
"",
" components: {},",
"",
" computed: {},",
"",
" mounted: {},",
"",
" methods: {}",
"}",
"",
"</script>",
"<style>",
"</style>",
"",
],
"description": "Log output to console"
}
}