1. 安装（卸载）插件贼溜
在左侧导航区域，点击扩展（Extensions），在上方的搜索框中输入需要安装的插件，点击install（uninstall）就可以完成安装或者卸载。
2. 全文检索
方便快捷
3. 配置快捷输出
文件–>首选项–>用户代码片段（找到vue.json文件）
下面是vue.json文件的简单配置, 配置好后在XXX.vue 文件中输入vue回车就会生成你配置的文本。
{
// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div class='warp'>$0</div>",
"</template>",
"",
"<script>",
"import {Conponent} from 'vue-pro'",
"export default {",
" props: {},",
" data () {",
" return {}",
" },",
" computed: {},",
" watch: {},",
" components: {},",
" methods: {},",
" mounted () {}",
"}",
"</script>",
"<style lang='less'>",
"</style>",
""
],
"description": "Log output to console"
}
}
4. 用户设置
配置编辑器的格式，字体，空格，代码检查等等
设置–>用户/工作区,根据自己的需要设置，或者在用户–>常用设置中找到–>setting.json文件中设置
{
// 控制字体系列。
"editor.fontFamily": "pingfang,Menlo, Monaco, 'Courier New', monospace",
// 字体大小
"editor.fontSize": 14,
// 通过使用鼠标滚轮同时按住 Ctrl 可缩放编辑器的字体
"editor.mouseWheelZoom": true,
// 行太长自动换行
"editor.wordWrap": "on",
//Windows bash终端"terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
// 主体
"workbench.colorTheme": "Monokai",
"workbench.iconTheme": "vs-seti",
// tab锁紧
"editor.tabSize": 2,
"files.associations": {
"*.html": "html"
},
"editor.formatOnType": false,
"editor.formatOnSave": false,
"workbench.sideBar.location": "left",
"eslint.autoFixOnSave": true,
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"jsx",
"vue",
{
"language": "html",
"autoFix": true
}
],
"vsicons.dontShowNewVersionMessage": true,
"python.jediEnabled": false
}
5.插件集
（1） Rainbow Brackets
Rainbow Brackets，可以将同一对花括号给定相同的颜色，可以一眼就看出配对的两个花括号。
（2） Indent Rainbow
Indent Rainbow 则可以给代码的缩进提供颜色上提示，和 Rainbow Brackets 这搭配使用，可以在代码层级较多时，也能看起来很清晰，一目了然。
（3） Project Manager
Project Manager 顾名思义就是项目管理，将多个项目管理起来，只需一键切换。
（4） Import Cost
在项目开发过程中，我们会引入很多npm包，有时候可能只用到了某个包里的一个方法，却引入了整个包，导致代码体积增大很多。Import Cost 可以在代码中友好的提示我们，当前引入的包会增加多少体积，这很有助于帮我们优化代码的体积。
（5） Pigment
遇到颜色代码时，Pigment会将颜色渲染在这段代码的下面。
（6） GitLens
GitLens可以显示每一行代码的作者，提交时间，以及commit信息，在想要知道哪行代码是谁改动的时候非常的实用。把鼠标移到这条提示上，会弹出更详细的描述，不止如此，GitLens 还可以查看代码的历史记录，能够查看某个 commit 的代码改动，能够 diff 任意commit或branch，进行对比。
（7） Settings Sync
Settings Sync 提供了同步个人设置的功能，当我们需要换电脑进行开发时，比如回家用自己的电脑，或者换了新的电脑，该插件可以帮你同步之前做的设置，不需要在每台电脑上都重新设置一次。（我比较喜欢）
（8） Markdown Preview Enhanced
超级强大的 Markdown 插件，这款插件可以让你拥有飘逸的 Markdown 写作体验。
程序员怎么可能不写文档？！Markdown Preview Enhanced 对Markdown语法进行了增强。
支持了目录，批注，自定义预览css，插入公式，纯文本绘图，导出导入文档，制作幻灯片，甚至，还可以在文档中跑代码。总之一句话非常强大，非常好用。
（9） ESlint
ESlint可以在我们在coding的时候，分析我们的代码，对有错误或不符合规范的地方，给出提示，让我们第一时间发现代码的问题。同时，还能在保存时，帮助我们自动修复一些问题。
（10） Path Intellisense
Path Intellisense可以智能提示路径，并帮我们自动补全路径。
（11） Document This
可以帮我们快速生成代码注释，比如一些函数的注释，能够自动抽取出参数的定义。比如下面的函数，只需在上面输入/**， 就会自动触发 Document This插件。
