本节将分享的是vscode的安装、配置和使用。
为何选择 VS code 编辑器？
工欲上其事必先利器，选择一个好的 代码编辑器，是提高开发效率的重要途径。常用的前端开发编辑器有：Sublime，atom，WebStorm等。我们推荐的是微软推出的 vs code 跨平台的代码编辑器，因为：
- 它比Atom更加的流畅，比 webstorm 更轻量；
- 免费而且功能强大，自带很多功能，例如代码格式化，代码智能提示补全等；
- 对JavaScript和NodeJS的支持非常好，是所有编辑器中对 JS 的超集typescript 支持最好的，因为它本身就是基于微软的ts语言开发的。
如何安装？
直接到https://code.visualstudio.com/下载安装即可，打开官网后，它默认的下载版本为我们所用的系统对应的版本。当然，我们也可以选择版本，如windows 版本或Linux版本。下载成功后，一直点击下一步即可。
如何使用
常用操作特别简单，在编写代码时边看边学即可。
插件配置
插件需要安装，打开vs code后，点击左侧栏 最下面那个类似 正方形的图片，即可看到已安装的插件，同时也可以搜索自己想要的插件，搜出来后直接安装即可，推荐插件如下：
- HTML Snippets 超级实用且初级的 H5代码片段以及提示；
- Auto Rename Tag 自动重命名配对的HTML / XML标签；
- HTML CSS Support 让 html 标签上写class 智能提示当前项目所支持的样式；
- Css Peek 能在源代码中的字符串中找到对应的css（类和ID），显示在那个css文件里，还有在第几行；
- Color Picker 代码的颜色选择器；
- open in browser 在浏览器中打开，安装后在左侧目录中右键点击会出现 open in browser 选项；
- Path Intellisense 文件路径提示；
- Npm Intellisense 在import语句中自动完成npm模块引入的代码插件；
- vscode-icon 让 vscode 资源树目录加上图标，必备良品；
当然，还有各种基于vue或react的插件，大家输入对应关键字，搜索后根据需要去安装即可。
好了，代码编辑器我们就介绍到这里，更多的配置和使用 我们会在课程用到时再进行讲解。
网友评论