VSCode中值得推荐的常用的33个高效前端插件效率篇（二）

　　VSCode是我们前端开发的一个强大的IDE，所以选择趁手好用的插件是提高开发效率，然后剩下的时间用来摸鱼是很有必要滴。
　　效率篇（33）PathIntellisense
　　PathIntellisense：自动完成文件名的VisualStudioCode插件。插件名：PathIntellisense官方地址：https：marketplace。visualstudio。comitems？itemNamechristiankohler。pathintellisense用法：
　　PathAutocomplete
　　PathAutocomplete：为VisualStudio代码提供路径补全。插件名：PathAutocomplete官方地址：https：marketplace。visualstudio。comitems？itemNameionutvmi。pathautocomplete特征：它支持相对路径（以。开头）它支持工作区的绝对路径（以开头）它支持文件系统的绝对路径（以：C：开头）它支持相对于用户文件夹的路径（以开头）它支持部分路径（。tmpfol将建议。tmpfolder1如果存在）pathautocomplete。excludedItems它通过选项支持项目排除它支持npm包（以az开头，与磁盘无关）支持选择文件夹后自动建议pathautocomplete。pathMappings它通过选项支持自定义映射它支持通过自定义转换插入的文本pathautocomplete。transformations它支持Windows路径pathautocomplete。useBackslash
　　ImportCost
　　ImportCost：此扩展将在编辑器中内联显示导入包的大小。该扩展使用webpack来检测导入的大小。插件名：ImportCost官方地址：https：marketplace。visualstudio。comitems？itemNamewix。vscodeimportcost特征：计算imports和requires进来的大小。目前支持：默认导入：importFuncfromutils；全部内容导入：importasUtilsfromutils；选择性导入：import｛Func｝fromutils；使用别名选择性导入：import｛origasalias｝fromutils；子模块导入：importFuncfromutilsFunc；require：constFuncrequire（utils）。Func；同时支持Javascript和Typescript
　　anyrule
　　anyrule：这下在使用正则判断表单内容时就不用每次都到处去百度了。插件名：anyrule官方地址：https：marketplace。visualstudio。comitems？itemNamerussell。anyrule用法：commandshiftp、fnF1（Mac）Ctrlshiftp（Window），然后输入关键词搜索，比如：手机
　　右键选择正则大全
　　RainbowBrackets
　　RainbowBrackets：为圆括号、方括号和波浪形括号提供彩虹色。插件名：RainbowBrackets官方地址：https：marketplace。visualstudio。comitems？itemName2gua。rainbowbrackets
　　indentrainbow
　　indentrainbow：此扩展为文本前面的缩进着色，每一步交替使用四种不同的颜色，使代码的缩进更具可读性。插件名：indentrainbow官方地址：https：marketplace。visualstudio。comitems？itemNameoderwat。indentrainbow
　　此插件默认是空白的背景颜色来展现缩进的，如果想要设置成线条模式来展现缩进，可以在settings。json文件中按如下配置：UsingthelightmodeindentRainbow。indicatorStyle：light，weuseasimple1pixelwidelineindentRainbow。lightIndicatorStyleLineWidth：1，thesamecolorsasabovebutmorevisibleindentRainbow。colors：〔rgba（255，255，64，0。3），rgba（127，255，127，0。3），rgba（255，127，255，0。3），rgba（79，236，236，0。3）〕
　　HighlightMatchingTag
　　HightlightMatchingTag：此扩展突出显示匹配的开始和或结束标签。插件名：HighlightMatchingTag官方地址：https：marketplace。visualstudio。comitems？itemNamevincaslt。highlightmatchingtag特征：
　　TODOHighlight
　　TODOHightlight：有时，在将代码发布到生产环境之前，您会忘记查看在编码时添加的TODO。所以我一直想要一个扩展来突出它们并提醒我还有笔记或尚未完成的事情。插件名：TODOHighlight官方地址：https：marketplace。visualstudio。comitems？itemNamewayou。vscodetodohighlight预览：materialnight颜色的主题
　　materialnighteighties颜色的主题
　　Quokka。js
　　Quokka。js：当您键入时，运行时值和带颜色的小图标会更新并显示在您的代码旁边的IDE中，绿色表示该行已被执行，红色表示该行是错误的来源，灰色表示没有被执行。插件名：Quokka。js官方地址：https：marketplace。visualstudio。comitems？itemNameWallabyJs。quokkavscode
　　Bookmarks
　　Bookmarks：书签，它可以帮助您在代码中导航，轻松快速地在重要位置之间移动。插件名：Bookmarks官方地址：https：marketplace。visualstudio。comitems？itemNamealefragnani。Bookmarks特征：可用命令Bookmarks：Toggle用书签标记取消标记位置Bookmarks：ToggleLabeled标记标记的书签Bookmarks：JumptoNext将光标向前移动，到下面的书签Bookmarks：JumptoPrevious将光标向后移动到上面的书签Bookmarks：List列出当前文件中的所有书签Bookmarks：ListfromAllFiles列出所有文件中的所有书签Bookmarks：Clear删除当前文件中的所有书签Bookmarks：ClearfromAllFiles从所有文件中删除所有书签Bookmarks（Selection）：SelectLines选择所有包含书签的行Bookmarks（Selection）：ExpandSelectiontoNext将所选文本展开到下一个书签Bookmarks（Selection）：ExpandSelectiontoPrevious将所选文本展开到上一个书签Bookmarks（Selection）：ShrinkSelection将选择文本缩小到上一个下一个书签
　　后续如有发现更多更好的插件将继续分享。安装太多的插件恐会影响VSCode的启动速度，同时增加内存的占用，可能影响开发效率，最终适得其反，所以建议只安装自己喜欢的、常用的即可。