Visual Studio Code 编辑器使用
image.png
之前一直都是用 sublime text 作为开发工具，用久了自然而然会觉得生活无趣，而且当时用sublime text 装了很多插件，有些插件不能用，于是决定试试微软的新产品 Visual Studio Code 。
1. 开始
在这里界面里你就可以看到一个非常有情怀的快速链接：安装键盘快捷方式（你可以安装包括但不限于 Vim、Sublime、Atom 的键盘快捷方式），所有这个 coding 工具还是非常容易上手的。
从体积来说比 Sublime text 大了不少，30多兆，启动速度也肯定会慢一些，但还是在可接受的范围内，这个还跟机器有关系。
Visual Studio Code 的快捷键设置是统一管理的，所以你只需要修改一个文件就可以了。我们先来看看 Visual Studio Code 的常用快捷键。
Visual Studio Code 有两个比较重要的文件，一个是 setting.json （基本设置），另一个是 keybindings.json（配置快捷键文件）。它们 分别在【文件】-【首选项】-【设置】和【文件】-【首选项】-【键盘快捷方式】。
2. 快捷键
极常用的快捷键：
ctrl + E 查找最近打开过的文件
ctrl + tab 在文件之间切换
ctrl + G 跳到指定行
Ctrl + Shift + F 在项目下所有文件内查找内容（并且可全局替换）
Ctrl + \ 或者 按住 Ctrl 双击文件。
Ctrl + p 全局搜索文件
Ctrl + Home / End 跳到文件头部或者尾部
更多可以看官网的https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf
3. 插件
image.png
在搜索框输入你要安装的插件便可以安装了。
这里介绍几个我必装的几个插件
3.1 vscode-icons
这是一个文件图标显示插件，可以根据你的文件类型开决定将显示何种图标。这样也不只是为了美观，还可以让自己一目了然。更好的定位到要查看的文件。
Visual Studio Code 插件 vscode-icons
3.2 vscode-fileheader
这个插件可以为你在文件开头插件头信息，比如文件的作者，修改时间，有了这个插件你就不需要每次都码一次所谓的无用信息了。
image
这个插件的用法也好简单：快捷键为：ctrl+alt+i，的依次点开【开始】-【首选项】-【设置】，在用户配置文件中添加如下代码：
"fileheader.Author": "https://www.geekjc.com",
"fileheader.LastModifiedBy": "https://www.geekjc.com"
想查看更多有用的插件 可以看VSCode拓展插件推荐（HTML、Node、Vue、React开发均适用
3.3 HTML CSS Support
列出项目里所有能用的类名，这个插件也挺有用的。有时候当你只记得一个类的首字母或者前几个字母时，这个插件就非常地有用了，当你敲出第一个字母后这个插件就会自动把项目里（当前HTML 文件引用到的.css 文件）与此匹配的类全都列出来，还带有来自哪个 .css 文件的提示。
Visual Studio Code 插件 HTML CSS Support
4. 补充如何设置插件的快捷键
我们可以给插件来配置快捷键。不管是什么插件，你都可以像下面这样配置快捷键。我们以 vscode-fileheader 插件为例子：
依次点开【文件】-【首选项】-【键盘快捷方式】，出现如下图
vscode.gif
按上图操作所示就可以设置快捷键了
5. 配置选项
有时候我们安装了很多插件，我们需要管理，需要开启或者关闭某些插件的功能，就可以用这个配置选项了
image.png
如上图左边的是默认的，右边的是用户自定义的，都可以编辑
6. 终端命令行工具 Terminal
在VS Code中提供了一个功能齐全的集成终端，这非常方便，因为您不必切换窗口或更改现有终端的状态就可以快速执行命令
intergrated-terminal
7. 最后
当然vscode还有很多提高效率和很酷的操作，慢慢挖掘，不断更新，关注极客教程
