始
哈喽
各位小红果们
新的干货分享来咯
今天我们将要手把手的教你使用VS Code
话不多说
现在就一起看下去吧
01
楔子
在 Build 2015 大会上，微软了宣布推出免费跨平台，支持30多种语言的开箱代码编辑器 Visual Studio Code！
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器，支持语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、GIT 等特性，并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux，运行流畅，可谓是微软的良心之作。
VS Code只是一款轻量级的代码编辑器，而不是一个重量级的完整 IDE (集成开发环境)，它的竞争对手将会是 Sublime Text、Atom、VIM、Notepad++ 等产品。
02
VS Code的下载和安装
官方网站：https://code.visualstudio.com/
本次安装的版本如下所示：
03
VS Code的简单介绍和使用
3.1界面介绍
3.2 快捷键
页面搜索：Ctrl + F
全局搜索：Ctrl + Shit + F
输入行号可以跳转到指定的行：Ctrl + G
打开命令输入框：Ctrl + Shift + P或者F1
Markdown预览：Ctrl + Shift + V
快速的切换文件: Ctrl + Tab
输入内容来搜索文件： Ctrl + P
列模式：Shift+Alt+鼠标
folding折叠
Fold (Ctrl+Shift+[) 折叠所在的这个部分
Unfold (Ctrl+Shift+]) 取消所在部分的折叠
Fold All (Ctrl+K Ctrl+0) 折叠当前编辑文件的所有可折叠部分
Unfold All (Ctrl+K Ctrl+J) 取消当当前文件所有折叠
Fold Level X (Ctrl+KCtrl+2 for level 2) 折叠所有level x(还可以用 Ctrl+3、Ctrl+4等)的缩进去(除了当前编辑位置所在的)
3.3 版本控制
要想使用Gi，必须先初始化，点击那个Initialize git repository按钮，初始化Git仓库。
初始化结果如下：
3.4 使用技巧
文件类型
使用快捷键，Ctrl + Shift + P，打开命令输入框，输入language
文件编码Ctrl + Shift + P打开命令面板，输入encoding
MarkDown
VS Code也支持markdown的书写和预览，如果要预览的话，要先保存文件，然后按下快捷键Ctrl + Shift + V,就可以预览了。
快速的切换文件
当我们编写多个文档时，经常需要在多个文件直接切换，用鼠标点击来切换是一个很奢侈的做法，我们通常都喜欢用快捷键。在Vs Code中，我们可以用Ctrl + Tab键来快速的切换文件
按住Ctrl键不要松，不断的按下Tab键来切换选择文件。当然，这只适用于比较少的文件时，文件多了，这样就不好用了。
文件多的时候，我们可以使用Ctrl + P快捷键，打开和上面一样的输入框，不过这个时候我们可以输入内容来搜索文件，然后选择打开。
04
插件
4.1 怎么安装插件
方法一：
按F1或Ctrl+Shift+P，输入extensions，点击第一个就可以
方法二：
Ctrl + P 然后输入 >ext install
方法三：
点击图中位置
4.2代码美化 Beautify
Beautify 插件可以快速格式化你的代码格式，让你在编写代码时杂乱的代码结构瞬间变得非常规整，代码强迫症必备，较好的代码格式在后期维护以及他人阅读时都会有很多的便利。
插件支持的语言非常多，基本堵盖了目前所有的语言，而且你还可以自定义代码格式化的结构。
4.3 文件图标 vscode-icons
首先为了我们在编码时有一个高效、易用的界面，我们需要对一些不明了的组件做一些美化。
vscode-icons 插件可以实现对各种文件类型的文件前的图标进行优化显示，这样我们在查看长长的文件列表的时候，可以直接通过文件的图标就可以快速知道文件的类型，而不是去看文件的后缀。
4.4 代码拼写检查 Code Spell Checker
此插件安装后就不用管就好了，在你代码中有单词拼写错误时，你就会发现它的好处，因为我们写代码毕竟都是大量的英文单词变量定义，插件还可以给出错误拼写单词的建议。
4.5 Settings Sync
最好用的插件，没有之一，一台电脑配置好之后，其它的几台电脑都不用配置。新机器登录一下就搞定了。再也不用折腾环境了，
使用GitHub Gist同步多台计算机上的设置，代码段，主题，文件图标，启动，键绑定，工作区和扩展。
4.6 中文(简体)语言包
Chinese (Simplified) Language Pack for Visual Studio Code
将界面转换为中文，对英语不好的人，非常友好。
4.7 guides
显示代码对齐辅助线，很好用
4.8Rainbow Brackets
为圆括号，方括号和大括号提供彩虹色。这对于Lisp或Clojure程序员，当然还有JavaScript和其他程序员特别有用。
4.9 Bracket Pair Colorizer
用于着色匹配括号
05
总结
简单的总结一下Vs Code的优点：
1、 支持30多种常用语言的语法高亮， 并对html、 js、 css、 Angular等很好的语法支持， 并且还支持MarkDown的预览！
2、 体积小， 功能强大， 当然性能也是很好的， 打开超大型的文本文件也不会卡死， 大家可以和其他的一些文本编辑器对比一下。
3、 支持命令操作(Ctrl + Shift + P) 和鼠标操作， 还有大量的快捷键， 可以适应各种开发者的操作习惯。
4、 支持Git版本控制器， 可以完成创建分支、 解决冲突、 提交修改等操作；
5、 强大的搜索功能， 并且支持多文件搜索；
6、 最大的优点， 当然是跨平台、 免费;
end
好啦，这些就是这期的全部内容啦！(看完的你给自己个大拇指吧)
今天我们学习了如何使用Visual Studio Code (简称 VS Code / VSC) 这一款免费开源的现代化轻量级代码编辑器
相信大家都一定收获满满呢
让我们猜猜下一次我们会分享什么干货捏
~(￣▽￣)~*
拜拜咯~
编辑 | 徐小策
审核 | 陈晗阳
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
