VSCode有一个非常强大的功能，就是支持插件扩展，让你的编辑器仿佛三头六臂，大大提高工作效率。上图中，点击红框，在输入框中找到你想要的插件名称，然后安装即可。这里推荐一些好用的插件，建议收藏起来以备后用！1、GitLens【推荐】简直就是Git神器，码农必备。GitLens在Git管理方面有很多强大的功能，比如：把光标放在当前代码行，就可以看到谁提交了代码，什么时候提交的。这是GitLens最方便的功能。查看一个commit的代码变更记录，查看不同的分支，比较两个commit的代码，甚至比较两个分支的整体代码。这简直就是GitLens最强大的功能。当我们在不同的分支中审查代码时，可以使用这个技巧。2.Git历史有些同学习惯在编辑器中使用Git管理工具，但是不喜欢再打开一个GitUI工具。这个插件可以满足你查询所有Git记录的需求。3.LiveServer[推荐]在本地启动一个服务器。代码写好后可以实现“热更新”，在网页上可以实时看到运行效果。您无需每次都手动刷新页面。使用方法：安装好插件后，开始写代码；编写代码后，右键单击并选择“使用实时服务器打开”。4.Chinese(Simplified)LanguagePackforVisualStudioCode允许软件以简体中文语言显示。5.BracketPairColorizer2：高亮配对括号[推荐]BracketPairColorizer2插件：以不同颜色显示配对括号，并用连接线标记括号范围。简称彩虹括号。此外，还有一个RainbowBrackets插件也可以高亮成对的括号。6、sftp：文件传输【推荐】如果需要通过ftp将本地文件上传到局域网中的服务器，可以安装sftp插件，非常好用。在公司里经常用到。7、在浏览器中打开安装好在浏览器中打开插件后，在HTML文件中“右击-->在默认浏览器中打开”即可在浏览器中预览网页。8.highlight-icemode：选中相同代码时，高亮更明显【推荐】VSCode自带的高亮确实不够显眼。用插件支持它。使用该插件后，可以关闭VSCode自带的高亮：在用户设置中添加“editor.selectionHighlight”:false。9、vscode-iconsvscode-icons会根据文件的后缀显示不同的图标，让你更直观的知道每个文件是什么类型。10、项目经理工作中，我们经常会来回切换多个项目。每次都要找到对应工程的目录再打开，很麻烦。ProjectManager插件可以解决这样的烦恼。它提供了一个特殊的视图来显示您的项目。我们可以把常用的项目保存在这里，需要的时候一键切换，非常方便。11、在写TODOHighlight代码的过程中，突然发现了一个bug，但是手头的工作又不想停下来，以免打断思路，怎么办？根据代码规范，我们一般会在代码中添加TODO注释。例如：（注意，一定要写成大写的TODO，不能是小写的todo）//TODO:这里有bug，待会儿给你清理一下或者：//FIXME:不知道为什么，但是可以用只有这样。安装插件TODOHighlight后，按住“Cmd+Shift+P”打开命令面板，输入“Todohighlist”，选择相关命令，我们可以看到一个todoList列表。12.MarkdownPreviewGithubStyling【推荐】在GitHubstyle中预览Markdown样式，非常简洁大方。就像下面这样，左边写Markdown文本，右边预览Markdown的渲染效果：13.MarkdownPreviewEnhanced预览Markdown风格。MarkdownAllinOne是一个插件，可以帮助您更有效地使用Markdown编写文档。14、VeturVue多功能集成插件，包括：语法高亮、智能提示、emmet、错误提示、格式化、自动补全、调试器。VSCode的官方Vue插件，Vue开发者必备。15.ES7React/Redux/GraphQL/React-NativesnippetsReact/Redux/react-router语法智能提示。16、minapp：小程序，支持小程序开发必备插件。17.Prettier：代码格式化Prettier是一款代码格式化工具，只专注于格式化，不具备校验功能。在多人协作开发团队中，统一的代码编写标准非常重要。一套规范可以让我们写的代码达到风格一致，提高代码的可读性和统一性。自然保养也会得到改善。18、ESLint：代码格式校验在日常开发中，推荐使用Prettier进行代码格式化，然后使用eslint进行校验。19.美化代码格式化工具。注：相比之下，Prettier是目前最流行的代码格式化工具，使用率高于Beautify。20.JavaScript(ES6)代码片段ES6语法智能提示，支持快速输入。21.搜索node_modules[推荐]node_modules模块里面文件夹和模块太多，不好找。好在安装Searchnode_modules插件后，输入快捷键“Cmd+Shift+P”，然后输入node_modules，在弹出的选项中选择Searchnode_modules，就可以在node_modules中搜索模块了。22.indent-rainbow:高亮代码缩进indent-rainbowplugin:高亮代码缩进。安装完成后，效果如下图所示：23.CodeSpellChecker：单词拼写错误检查这个拼写检查程序的目标是帮助捕捉常见的单词拼写错误，并可以检测驼峰命名。告别中式英语。24、LocalHistory[推荐]维护本地历史文件，强烈推荐安装。当代码意外丢失时，它有时可以挽救生命。25.Polacode-2020：生成代码截图【推荐】可以将代码片段保存为美图。不同的主题和代码配色方案也不同。您还可以自定义图片的边框颜色、大小和阴影。当我们在做PPT分享的时候需要用到代码片段，或者需要在网络上优雅地分享代码片段的时候，这个技巧就特别有用。生成效果如下：其他类似插件：CodeSnap。我们也可以通过https://carbon.now.sh/这个网站生成代码图片。26、图片预览【推荐】图片预览。当鼠标移到图片地址上时，会自动显示图片预览和图片大小。27.AutoCloseTag,AutoRenameTag自动关闭标签和自动重命名标签。28.BetterComments为评论添加了更醒目的分类颜色。29.CSSPeek增强HTML和CSS的关联，快速查看元素上的CSS样式。30.VueCSSPeekCSSPeek不支持Vue，这个插件提供了对Vue文件的支持。31.ColorInfo是一个方便的插件，它将为您提供有关您在CSS中使用的颜色的信息。只需将光标悬停在颜色上，即可在色块中预览有关颜色模型（HEX、RGB、HSL和CMYK）的信息。32.导入成本在项目开发过程中，我们会引入很多npm包。有时可能只使用了某个包中的一个方法，却引入了整个包，导致代码量大幅增加。ImportCost插件可以在代码中友好的提醒我们当前导入的包体积会增加多少，这对于帮助我们优化代码体积非常有帮助。33.PasteJSONasCode这个插件可以将剪贴板中的JSON字符串转换成工作代码。支持多种语言。
