vs code作为一个轻量级且强大的源代码编辑器，从诞生之初就备受关注
我是从17年开始使用它，从开始用就爱上了它，它最大的特点就是生态强大，不管是官方还是民间，都是如此，依托微软强大的底层应用构建能力以及众多贡献者，vs code已经变成了当今最受欢迎的编辑器
我第一次用就爱上了它，并在使用过程中用到了一些有助于我们开发的插件（应用）
在这里做个整理，也算是个大家一个推荐~
==已勾选的是已应用的==
浏览器扩展：
- open in browser : 允许您在默认浏览器或应用程序中打开当前文件
- Debugger for Chrome: 在Chrome浏览器调试JavaScript代码（需在编辑器中设置断点）
- Live Server：具有静态和动态页面的实时重新加载功能的本地开发服务器
- Preview on Web Server：提供web服务器和实时预览功能
- PHP Server ：对于测试仅需要在客户端运行的 JavaScript 代码非常有用
- Rest Client：您可以安装此工具以在编辑器内交互式运行HTTP 请求，而不是使用浏览器或 CURL 程序来测试 REST API 端点
未完待续…
代码格式化扩展
- Document This : 自动在typescript和javascript文件中生成详细的jsdoc注释
- 只能在==typescript==和==JavaScript==中才能生成
- 只能在项目js和ts文件中才能生成，单独的js和ts文件无法生成
- Beautify : 美化VScode内的代码（包括设置缩进等）
- JavaScript Booster ：一个牛逼的代码重构工具。具有多种编码操作，例如将 var 转换为 const 或 let ，删除冗余的 else语句，以及合并声明和初始化。很大程度上受到 WebStorm 的启发。
未完待续…
代码检查扩展
- ESLint : 将eslint javascript集成到VS代码中
- TSLint : 支持在VScode中检查Typescript
未完待续…
代码提示扩展
- Auto Close Tag : 自动添加html/xml标签关闭，与sublime/Visual Studio IDE类似
- Auto Import : 自动查找、分析和提供所有可用导入的代码操作和代码完成。与类型记录和TSX一起工作
- Auto Import-ES6,TS,JSX,TSX : 自动查找、分析和提供所有可用导入的代码操作和代码完成。使用javascript和类型记录
- Auto Rename Tag : 自动重命名配对html/xml标记
- HTMLHint ：HTML文档格式提示扩展
- IntelliSense for CSS class names in HTML : 基于工作区中的定义为html类属性完成CSS类名
- CSS Peek : 允许通过CSS id和类字符串作为条件从html文件查看到各自CSS的定义并可以进行修改
未完待续…
代码片段扩展
- HTML CSS Support : Visual Studio Code CSS Support for HTML Documents(CSS支持HTML文档)
- HTML Snippets : VS Code html模板 有可能和上一个扩展冲突
- VS Code JavaScript(ES6) snippets ：目前最流行的，迄今为止安装量超过 120 万。此扩展为 JavaScript ， TypeScript ，HTML，React和Vue扩展提供 ES6 语法支持
- rxjs-snippets : 为开发人员提供支持rxjs代码片段的扩展
未完待续…
语法扩展
- indent-rainbow : 使缩进更易读懂
- JavaScript Atom Grammar ：此扩展使用 Atom 编辑器中的 JavaScript 语法替换 Visual Studio Code 中的 JavaScript 语法
- DotENV ：支持
.env文件语法高亮显示。如果您正在使用Node，请使用方便 - Babel JavaScript ：支持 ES201x JavaScript，React，FlowType和GraphQL代码的语法高亮显示
未完待续…
Node扩展
- npm : 使用
package.json验证已安装的软件包。确保已安装的软件包版本号正确，高亮显示package.json中缺少的已安装软件包以及尚未安装的软件包 - npm Intellisense : 自动完成导入语句中的NPM模块
- Path IntelliSense ：它和Node.js 其实并不相关，但你肯定需要对本地文件的智能提示，这个扩展将自动补全文件名
- Node exec ：允许您使用==Node.js==执行当前文件或您选择的代码
- View Node Package ：使用此扩展快速查看 Node 包源，允许您直接从 VS Code 打开 Node 包仓库库/文档
- Node Readme ：快速打开npm包文档
未完待续…
GIT相关扩展
- Git History : 可查看git日志、文件历史记录、比较分支或提交
- Git Project Manager : 允许轻松地在git项目之间进行更改
- GitLens–Git supercharged ：git多人协作的时候需要查看日志，如果能在当前代码中查看到那是很方便的一件事，能省去很多时间去其他工具查看，提高工作效率
- 每一行代码旁边都有日志
- 也可以查看全部的日志，在VsCode左侧菜单栏，点击GitLens图标即可查看History
- 还可以很方便的操作查看上下push记录
- 有个不方便的地方就是不能复制每一次push的详细代码清单，所以只能使用命令log或者其他外部工具了
使用命令方法是：
1、右键查看指定push的日志，选择Copy Commit ID to Clipboard获得Commit ID，
2、VsCode中使用快捷键ctrl + ~启动终端，输入命令git log --name-only -n1 CommitID即可得到下图的push代码清单
未完待续…
Markdown相关扩展
- markdownlint : markdown代码的标记/通用线型和样式检查
- Markdown Perview Enhanced ：在VScode中支持markdown标记预览增强
未完待续…
框架相关扩展
- Vetur : 在vscode中支持vue语法
- Vue 2 Snippets : vuejs2.x语法扩展
未完待续…
其他实用扩展
- One Dark Pro : 根据个人喜好更换VS Code的代码颜色主题
- vscode-icons : vscode图标
- SVG Viewer : 支持在VScode中查看SVG图标
- Import Cost : 在编辑器中显示导入/要求包大小
- Chinese(Simplified) Language Pack for VS Code : 适用于VScode的中文(简体)语言包
- any-rule : 日常开发所需要的正则
未完待续…