本文将介绍一些作者推荐的适用于Visual Studio 2017的常用扩展插件
1.Web Essentials 2017
Web开发基础 - 核心插件
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebExtensionPack2017
官方文档>>https://github.com/madskristensen/WebEssentials2017
该插件为后续几个插件的前置插件
2.Bundler & Minifier
Web开发基础 - js/css合并压缩器
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier
官方文档>>https://github.com/madskristensen/BundlerMinifier
该插件提供了js/css代码的压缩与合并功能
如上图所示，在需要压缩的文件上右键，选择【Bundler & Minifier】-【Minify File】，即可压缩文件，插件会自动在该文件的子级生成一个新的带".min"的文件
另外，还可以使用Bundle功能将多个文件合并成一个
选中要合并的文件，点击右键，选择【Bundler & Minifier】-【Bundle and Minify Files】
插件会根据设置把选中的文件的内容合并到一个新的文件中
- 插件会在源文件被修改（并保存）后实时更新压缩或合并后的文件
- 插件会根据根目录的bundleconfig.json来执行动作，用户可自行修改该配置文件以改变插件的动作
3.Web Compiler
Web开发基础 - less编译器
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebCompiler
官方文档>>https://github.com/madskristensen/WebCompiler
该插件提供了less文件编译功能
如上图所示，在需要编译的less文件上右键，选择【Web Compiler】-【Compile File】，即可编译文件，插件会自动在该文件的子级生成一个未压缩的".css"文件和一个已压缩的".min.css"的文件
- 插件会在源文件被修改（并保存）后实时更新编译后的文件
- 插件会根据根目录的compilerconfig.json来执行动作，用户可自行修改该配置文件以改变插件的动作
可以在compilerconfig.json中添加上图的代码让插件在执行编译时不生成压缩文件
4.HTML Tools
Web开发基础 - HTML辅助工具
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.HtmlTools
官方文档>>https://github.com/madskristensen/HtmlTools
该插件提供了一些HTML语言编程辅助，例如将鼠标移到一个img标签的src属性上，可以立即预览图片
5.CSS Tools
Web开发基础 - CSS辅助工具
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.CSSTools
官方文档>>https://github.com/madskristensen/CssTools
该插件提供了一些CSS语言编程辅助，例如显示颜色、预览字体、预览图片等
6.File Icons
Web开发基础 - 常见文件类型图标
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.FileIcons
官方文档>>https://github.com/madskristensen/FileIcons
该插件提供了一系列Web开发中常见的文件类型的图标
7.File Nesting
Web开发基础 - 文件内嵌
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.FileNesting
官方文档>>https://github.com/madskristensen/FileNesting
该插件提供了文件内嵌功能，允许用户将一个文件内嵌到另一个文件的子级，并允许取消内嵌
如上图所示，在想要被内嵌的文件上右键，选择【File Nesting】-【Nest item】，选择要内嵌到的目标文件，即可将当前文件内嵌到目标文件的子级
8.Image Optimizer
Web开发基础 - 图片处理
下载地址>>https://marketplace.visualstudio.com/items?itemName=MadsKristensen.ImageOptimizer
官方文档>>https://github.com/madskristensen/ImageOptimizer
该插件提供了图片相关操作的功能，例如可以右键一张图片可以选择复制该图片的base64数据到剪贴板
9.Devart T4 Editor
T4模板编辑器
下载地址>>https://marketplace.visualstudio.com/items?itemName=DevartSoftware.DevartT4EditorforVisualStudio
提供了T4模板文件（后缀名为.tt）的编辑功能
什么是T4模板？自行百度^_^
10.Code Compare
代码比较器
下载地址>>https://www.devart.com/codecompare/download.html#anchorDowload
提供了文件比较功能
可以快速比较两个文件的代码差异，且不单限于VS使用，插件还提供Windows资源管理器集成，安装后可以直接在Windows文件夹里任意比较文件