本文目录：
- 1.汉化
- 2.常用插件
- 3.设置默认浏览器
- 4.用户代码片段
- 5.调节左侧导航栏字体大小
- 6.修改格式化代码样式
- 7.Eslint插件和settings sync插件
- 8.常用快捷键
VS-code是微软推出的一款免费的代码编辑器，下载和安装都十分简单。之前用过hbuilder、webstorm、sublime，感觉webstorm很好用，但是破解太复杂，用了一段时间之后又需要重新寻找破解码，sublime没太了解，感觉是和vscode一样的轻量编辑器，但不是免费的，hbuilder是免费的，用起来还可以，但是UI太丑了，用起来感觉不“顺滑”，所以自从下载vs-code之后，我就决定，以后的编辑器，就用他了！
1.汉化
对英文不熟练的小伙伴首先第一件事当然就是汉化它！
- 首先打开VSCode软件，可以看到刚刚安装的VSCode软件默认使用的是英文语言环境。
- 接下来小编开始设置为中文语言环境，这里需要使用快捷键【Ctrl+Shift+P】来实现。
- 在弹出的搜索框中输入【configure language】，然后选择搜索出来的【Configure Display Language】。
- 然后就打开了locale.json文件，可以看到locale的属性值为en。
- 删除locale后面的属性直到冒号，然后重新输入冒号会自动出现代码提示。
- 选择“zh-CN”。
- 然后保存locale.json文件，重新启动VSCode软件，可以看到，并没有变为中文语言环境，那是应为locale.json中的代码配置的意思是说软件启动加载语言配置包为中文，但是实际上刚刚安装的VSCode并没有中文语言包，所以这里并没有显示为中文语言环境。
- 在安装插件的位置输入Chinese，然后选择【Chinese （Simplified）Language Pack for Visual Studio Code】，然后点击右侧的【Install】。
- 安装好中文语言包之后软件会提示重启VSCode，点击【Yes】重启VSCode软件。
- 重启VSCode软件之后就会看到我们熟悉的中文语言环境界面了。
2.常用插件
VS-code因为是一款轻量的编辑器，所以自身的功能并不齐全，但是依赖于强大的生态支持，通过丰富的插件配置，我们可以把VS-code配置成我们想要的模样。
插件常见名称的关键词
Snippets 智能提示的意思
Syntax语法的意思
highlight 高亮
懒人专用：xxxx Extension Pack xxxx的扩展包，快速组建vscode的开发环境
插件推荐：
- Path Intellisense 自动路径补全
2.Chinese (Simplified) Language Pack for Visual Studio Code 汉化包
3.vetur 支持vue的语法高亮、智能感知、Emmet 等
4.VueHelper snippet 代码片段
5.Vue VSCode Snippets 很全面的vue代码片段
6.vue Syntax Highlight for Vue.js
7.Auto Close Tag 自动添加HTML / XML关闭标签
8.Auto Rename Tag 自动重命名配对的HTML / XML标签
9.HTML Snippets 代码自动填充
10.Live Server 浏览器实时刷新
11.Bracket Pair Colorizer 给括号加上不同的颜色，便于区分不同的区块
12.JavaScript(ES6) code snippets ES6语法智能提示
13.open in browser 支持快捷键与鼠标右键快速在浏览器中打开html文件
14.HTML CSS Support 智能提示CSS类名以及id
15.jQuery Code Snippets jQuery代码智能提示
16.Markdown Preview Enhanced 实时预览markdown，markdown使用者必备
17.Material Icon Theme 一款很不错的图标主题，支持更换不同色系的图标
18.ES7 React/Redux/GraphQL/React-Native snippets
React/Redux/react-router语法智能提示
19.document this 这个插件的作用是能够让你快速的对类和函数添加注释，通过按两次ctrl+alt+D按键可以快速增加注释。
20.language PL/SQL 支持sql语句
21.code runner 安装之后鼠标右键就可以运行代码
22.gitlens 可以看到每一行代码的作者
23.Visual Studio Intellicode 这个插件能帮助开发人员生成智能代码补全提示，并且它内置支持很多种编程语言。
24.Synthwave ‘84 银翼杀手风格的酷炫主题风格
25.Highlight Matching Tag突出显示匹配的开始或结束标签。
26.Image preview悬停时显示图像预览。
27.Indent Rainbow 此扩展使文本前面的缩进着色，在每个步骤上交替使用四种不同的颜色。
28.gitignore 添加文件或者文件夹到gitignore，安装了之后在导航栏右键就可以直接add to gitignore
29.minapp 微信小程序标签、属性的智能补全
30.Project Manager 项目管理，可以快速的切换项目
32.Docker
33.Eslint
34.Turbo Console Log ctrl+alt+L 可以快速生成console语句
35.Live Sass Compiler 安装插件之后VSCode的下方会有个“Watch Sass”按钮，可以实现sass的实现编译预览
36.Easy less
37.Prettier
3.设置默认浏览器
导航栏（文件=>首选项=>设置）
在搜索框中输入“open-in-browser.default”，然后设置自己想要的默认浏览器就可以了，一般情况下用“chrome”，火狐的话设置为“firefox”，然后crtl+s进行保存就可以了。
4.用户代码片段
文件=》首选项=》用户代码片段
新建全局代码片段
事先定义一段代码，然后通过关键字去触发
prefix指的是片段触发名称，body里放的是代码片段
description是代码片段的描述
1指的是代码片段生成后光标所在的位置，用tab可以进行快速的切换
5.调节左侧导航栏字体大小
在Visual Studio Code的安装目录下依此找到 Microsoft VS Code\resources\app\out\vs\workbench\ 目录下的workbench.main.css文件，打开搜索 .monaco-workbench>.part>.content
其后面会找到(font-size:16px)，将其改成自己想要的字号，然后重启vscode，就修改完成了。
6.修改格式化代码样式
安装上面的所有插件后，在使用中会发现一个问题就是使用shift+alt+F快捷键格式化代码，字符串的引用会自动变成双引号，语句结尾也会自动加上分号，这不符合使用习惯，解决方法：
文件=>首选项=>设置，搜索“vetur.format.defaultFormatterOptions”，然后点击”在settings.json中编辑“，在"vetur.format.defaultFormatterOptions"中添加
{
"singleQuote": true,
"semi": false
}
7.Eslint插件和settings sync插件
vscode可以安装 eslint 插件，用来自动的检测不符合eslint规则的地方，注意需要配合eslint库使用。
在eslint的rules里面一条条的添加规则太麻烦，可以安装相关插件，引用这个插件之后，相关规则就会自动引入，eslint-plugin-vue
eslint.vuejs.org/user-guide/#installation
vscode配置插件保存代码自动按照eslint规则格式化代码
ctrl+shift+p调出来快捷搜索 首选项=>打开工作区设置，搜索auto单词
扩展=>eslint ，auto fix on save 打上勾
接下来ctrl+shift+p调出来快捷搜索 首选项=>打开工作区设置(JSON)，这时候打开的是settings.json的而文件，可以安装一个插件，用来配置这个文件，settings sync，安装后登陆github，可以自动上传我们的配置
点击edit configration
输入相关gist 可以拉取已配置好的代码
接下来，下载配置
拉取了别人的配置，想要更新一下，并且变成自己的配置
此时进入插件页面，可以登陆github，然后更新配置代码后，
高级配置里面可以将自己的gist上传并公开分享
8.常用快捷键
alt+shift+上箭头或者下箭头：快捷复制当前行
alt+shift+d：快速拉取出多个光标
alt+G：快速跳行
