一、vs code 常用插件
安装方法：点击vscode左侧扩展，搜索插件，点击安装
- Path Intellisense 可以查找文件路径
- Auto Rename Tag 改变开始标签自动修改结尾标签
- Document This js 的注释模板( 按两次 Ctrl+Alt+D ，只在js文件中有效)
- beautify 格式化代码的工具
- AutoFileName 文件路径自动补全插件
- ESLint 添加对 ESLint 的支持
- Project Manager 项目管理器插件，可以在你的编辑器中快速切换项目
按F1，输入pm会出来相关的命令
打开文件件，选择响应的save命令进行保存，后续才能打开
- Settings Sync 设置同步插件( 方法参考：https://blog.csdn.net/u012207345/article/details/78246623#commentBox )
- Align 使代码根据 =，: 等对齐
- npm Intellisense 在 import 导入语句中自动完成npm 模块。
- Vetur vue开发者才需安装，包含语法高亮、代码片段、Emmet、代码格式化、错误检测功能
二、vs code 常用快捷
- 命令面板：F1（命令面板可以执行相应插件）
- 重命名：F2
- 跳转定义（切出新编辑器）： Ctrl + Alt + click
- 跳转定义（切出新tab）：F12 或 Ctrl + 左键点击文件
- 快速定位文件 ctrl + p
- 分割编辑窗口 ctrl+ \
- 快速调出终端 Ctrl+`
- ctrl + d 选择同样元素
- shift + tab 移动代码
三、Emmet
输入 div 回车
<div></div>
扫描二维码关注公众号，回复：
3901514 查看本文章
<!-- div.className -->
<div class="className"></div>
输入 div#IDname 回车
<div id="IDname"></div>
输入ul>li*2 回车
<ul>
<li></li>
<li></li>
</ul>
更多阅读：http://www.w3cplus.com/tools/emmet-cheat-sheet.html
四、snippets 定义代码片段，便于快速复用
依次点击：左下角设置图标=》用户代码片段=》在顶部弹出框中选择新建代码片段，起个名字保存后，生成的文件注释中有下面一段，把注释去掉，修改对应的内容即可，各项内容含义看下面注释。
"Print to console": { //是智能提示显示的
"scope": "javascript,typescript",
"prefix": "log", //用户输入此处字符进行提示
"body": [//代码片段写在此处
"console.log('$1');", // $1代表光标位置
"$2"
],
"description": "描述"
}
这样定义后，下次输入log，就会显示提示，在提示中选择我们定义的那项，就会将代码片段插入，光标自定义到相应的$1处