Visual Studio Code 开源免费跨平台代码编辑器

微软良心之做——Visual Studio Code 开源免费跨平台代码编辑器　　

　　在 Build 2015 大会上，微软除了发布了 Microsoft Edge 浏览器和新的 Windows 10 预览版外，最大的惊喜莫过于宣布推出免费跨平台的 Visual Studio Code 编辑器了！

　　Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器，支持语法高亮、智能代码补全、自定义热键、括号匹配、代码片断、代码对比 Diff、GIT 等特性，并针对网页开发和云端应用开发作了优化。软件跨平台支持 Win、Mac 以及 Linux，运行流畅，可谓是微软的良心之做……

　　相信不少程序员同窗都没想过有一天能在不用虚拟机的状况下直接在 Mac、Linux 上使用 VisualStudio 吧。固然，微软称 Visual Studio Code 并不是完整版的 Visual Studio，它只是一款轻量级的代码编辑器，而不是一个重量级的完整 IDE (集成开发环境)，它的竞争对手将会是 Sublime Text、Atom、VIM、Notepad++ 等产品。

　　当你开始阅读这篇文章时，请先不要把Visual Studio Code和.net、Windows联想到一块儿，由于VS Code是一个跨平台，支持30多种语言的开箱代码编辑器。无论你是.Net、Java、PHP、Python、TypeScript、Objective-C...仍是前端开发者，你都值得拥有。下面，让咱们来看一看Visual Studio Code 这个神器吧~

1、Visual Studio Code的下载和安装

　　Visual Studio Code最新版下载地址，https://www.visualstudio.com/，文件不到60M，如图：

　　

　　下载完成后，单击下载的exe文件便可自动安装，这儿须要注意的时，安装时没有指定安装的路径，有的童鞋安装完后就不知道如何打开了，个人电脑是win7的，安装的默认路径为：

　　C:\Users\%USERNAME%\AppData\Local\Code\app-0.3.0\Code.exe

2、Visual Studio Code简介

 　　安装完成后，咱们看到的Visual Studio Code界面以下，固然不一样的系统界面边框略有不一样，基本布局如图：

下面咱们来进行一些简单的设置，下面就拿你们最关心的字体大小设置来讲吧，其余的都相似，点击如图菜单：

咱们会看到以下页面，VS Code会打开两个文件：

　　左边的是默认设置，右边的是用户设置，其余的一些设置均可以在左边的默认设置里面找到，咱们要修改什么设置，拷贝到右边的窗口中修改便可。例如，咱们要修改字体大小，如图修改就行了，注意这是个json文件。 

　　工具栏简介

　　一、资源管理器

　　下面来看一下右边的工具栏，资源管理器就不用多说了很简单，只是这里有个功能值得注意一下，如图：

　　在文件上面点击鼠标右键，有个Copy Path，能够复制文件的物理路径。固然，你会想为何不是打开文件位置啊，其实这个功能已经有了，就是Reveal in Explorer.记住啦，不要再无知的吐槽了~

其余的菜单，本身点点就知道了，比较简单，我就不废话了。

　　二、搜索

　　下面来讲说这个搜索，为何要在这个地方加一个搜索的工具栏呢？若是你熟悉Visual Studio的话，你会发现按快捷键Ctrl + F会出现一个搜索框，如图：

　　细心的你也许会发现，当你按下Ctrl + Shit + F的时候，会激活这个工具栏的搜索功能，没错，这个功能就是相似Visual Studio中的全局搜索功能，如图：

　　看到了吧，这里的搜索结果，在1.html中和2.html中都搜索出来了"博客园"这个关键字。看到这里，已经心动了吧~~

还有Ctrl + G键，输入行号能够跳转到指定的行！ 

　　三、Git版本控制

　　这个功能，用过Git你们都清楚，Git的初始化必须在一个空的文件夹里面，因此要使用这个功能，也是要先有一个文件夹的，下面咱们来看看怎么操做，如图：

　　是否是感受很流弊，右键文件夹均可以直接打开，打开后，咱们继续看，如图：

　　到了这里，很明显了，点击那个Initialize git repository按钮，初始化Git仓库。而后，咱们新建一个文件，名字为index.html,保存到这个文件夹下。接下来，注意啦，注意啦，咱们要输入如下内容，如图：

　　若是你还一行一行的敲，那就太low了，这里先交给你们一个方法，在空白的文档里面输入一个感叹号！，注意是英文的哦，而后，点击Tab键，看看发生了什么，是否是duang的如下就出来了~~

　　而后，咱们按Ctrl + S保存文件，再来看Git这个工具栏的变化，如图：

　　咱们看到了，changes里面出现了index.html,而后，咱们输入commit message，点击上面的对勾提交，而后，咱们会看到changes下面的文件都消失了，而且右边的1变成了0。

　　点击那个...按钮，会弹出菜单，这里有更多的Git的操做，我就不一一介绍了，相信使用过Git的都看的懂的！ 

　　四、调试

　　这个功能简单的说就是调试代码，若是要使用的话还要进行一些配置，具体你们看官方文档Debugging,我就再也不细说了，你们有兴趣就本身去研究吧~~

 3、Visual Studio Code上手体验

　　VS Code支持多种语言，咱们先来看一下官方的说明：

　　这里大概说的是对CSS, HTML, JavaScript, JSON, Less, Sass几种语言有智能提示，其余的语言都是语法高亮和重构。就是说你写C#、Java等一些代码都是没有智能提示的，可是都会有语法高亮。这些代码查看，你们能够打开一些相关的代码文件看看，我就不一一演示了。 

　　一、文件类型

　　下面咱们来看看VS Code编写代码是否顺手，点击菜单新建文件或者使用快捷键Ctrl + N，这个时候会新建一个Untiled-1的文件，默认为文本文件，不高亮和提示任何代码，这个时候咱们能够经过保存文件来改变文件类型，或者直接告诉Vs Code文件类型，如图：

　　点击Plain Text，而后在弹出的输入框输入你想要的语言就行了。或者咱们使用快捷键，Ctrl + Shift + P，打开命令输入框，输入language，如图：

　　选择第一个Change Language Mode,也能够打开这个语言选择框。

　　这里首先要说的是VS Code对html的支持，固然Vs Code对html支持是很是好的，上面咱们已经看到了，输入一个感叹号，而后按下tab键就一会儿完成了html5文档的基本结构。其实，这是VS Code里面添加了Emmet snippet expansion，官方文档地址http://docs.emmet.io/cheat-sheet/，咱们大概来看一下：

　　看到了吧，第一个就是咱们上面使用的，同理若是咱们输入<a>标签，咱们只要输入a，而后按tab键就能够了。这里就再也不多说了，就留给你们去好好探索了~

　　另外，VS Code也支持Html5和AngularJs的智能提示，能够说是前端神器啊~~哈哈，目前我知道的也只有VS2015支持AngularJS的智能提示了。 

　　二、文件编码

　　文件编码固然是很重要的，有时候咱们要查看和修改文件编码，在介绍VS Code的时候，已经告诉你们，在哪里显示文件的编码了，下面咱们来讲一下如何修改文件编码，仍是Ctrl + Shift + P打开命令面板，输入encoding,如图：

　　选择之后，会出现以下选项：

　　咱们能够根据须要选择，这里咱们选择保存的编码格式，如图：

 　三、MarkDown

　　还有一个比较让人喜欢的一点就是VS Code也支持markdown的书写和预览，下面咱们看一下：

　　若是要预览的话，要先保存文件，而后按下快捷键Ctrl + Shift + V,就能够预览了。如图：

 　　四、文件的切换

 　　当咱们编写多个文档时，常常须要在多个文件直接切换，用鼠标点击来切换是一个很奢侈的作法，咱们一般都喜欢用快捷键。在Vs Code中，咱们能够用Ctrl + Tab键来快速的切换文件，如图：

　　按住Ctrl键不要松，不断的按下Tab键来切换选择文件。固然，这只适用于比较少的文件时，文件多了，这样就很差用了。

　　文件多的时候，咱们可使用Ctrl + p快捷键，打开和上面同样的输入框，不过这个时候咱们能够输入内容来搜索文件，而后选择打开。如图：

　　

　　五、支持打开一个文件夹

 　 当咱们编辑一个项目中的文件时，同时打开一个文件夹但是很是爽的功能，其余不少文本编辑器都不具有这样的特点。

　　看到这里，如今感受VS Code怎么样呢？固然，这只是VS Code的一小部分功能，还有更多的等待你们去发现！等到正式版出来的时候，估计会更加的好~~ 　　

4、总结

 　　因为篇幅的关系，关于VS Code就先介绍到这里了，下面来简单的总结一下Vs Code的有点：

　　一、支持30多种经常使用语言的语法高亮，并对html、js、css、Angular等很好的语法支持，而且还支持MarkDown的预览！

　　二、体积小，功能强大，固然性能也是很好的，打开超大型的文本文件也不会卡死，你们能够和其余的一些文本编辑器对比一下。

　　三、支持命令操做(Ctrl + Shift + P)和鼠标操做，还有大量的快捷键，能够适应各类开发者的操做习惯。

 　  四、支持Git版本控制器，能够完成建立分支、解决冲突、提交修改等操做；

　　五、强大的搜索功能，而且支持多文件搜索；

　　六、最大的有点，固然是跨平台、免费;

 

　　微软这近段时间来不断开放的姿态，愈来愈让咱们看到微软的情怀和将来。有人说 VSC 的推出又多了一个买 Mac 的理由了，不过其实细想，随着 .Net 的开源，加上免费的 VS Code 铺路，反而是能让一大批开发高手从新回到微软的大环境中，不得不说微软此次又下了一手好棋啊。

做者： EricHu 
出处：http://www.cnblogs.com/huyong/ 
Email：406590790@qq.com 
QQ交流：406590790 
框架官网：http://www.rdiframework.net/ 
框架官网博客：http://blog.rdiframework.net/ 
框架其余博客：http://blog.csdn.net/chinahuyong 
               http://www.cnblogs.com/huyong
RDIFramework.NET，基于.NET的快速信息化系统开发、整合框架，给用户和开发者最佳的.Net框架部署方案。 
关于做者：高级工程师、信息系统项目管理师、DBA。专一于微软平台项目架构、管理和企业解决方案，多年项目开发与管理经验，曾屡次组织并开发多个大型项目，在面向对象、面向服务以及数据库领域有必定的造诣。现主要从事基于 RDIFramework.NET 框架的技术开发、咨询工做，主要服务于金融、医疗卫生、铁路、电信、物流、物联网、制造、零售等行业。 
若有问题或建议，请多多赐教！ 
本文版权归做者和CNBLOGS博客共有，欢迎转载，但未经做者赞成必须保留此段声明，且在文章页面明显位置给出原文链接，若有问题，能够经过邮箱或QQ 联系我，很是感谢。