一些非常有用的 VSCode 扩展

5,618 阅读2分钟
原文链接: zhuanlan.zhihu.com
简评:你是否切换到 VSCode 并正在寻找一些有用的扩展?以下是一些我最喜欢的 VSCode 扩展。

Html Tag Wrap

这个扩展可让你选择一个单词、句子或多行文本,并用指定的 html 标签包起来(快捷键:Alt + W 或 Option + W)

React.js code snippets

如果你正在使用 React.js,你会发现这些片段非常有用。

rcc 将创建 React 类组件骨架,rsc 将创建 React 无状态组件等等。


Npm Intellisense and Path Intellisense

当使用 React.js 时,经常需要导入其他模块,这两个扩展将通过自动完成导入语句为你节省大量时间。

Npm Intellisense 自动完成导入语句中的 npm 模块,Path Intellisense 自动补全文件名。

Git Blame

Git Blame 会在状态栏中添加一个 git blame 信息。这有助于快速查看哪些人对工作文件进行了最后一次更改,以及某行辣鸡代码到底是谁写的。

Git History

如果需要查看更详细的提交历史,Git History 是你最好的朋友。

Bookmarks

这可能是此列表中最有用的扩展之一。它允许你在文件的任何位置创建书签(ctrl+alt+k 或cmd+option+k),然后通过 cmd+option+j 或 cmd+option+l 快速在书签之间跳转。

Sublime Text Keymap

如果你 Sublime Text 的老用户,此扩展将使你喜欢的 Sublime Text 快捷方式在 VSCode 中可用。

HTML Class Suggestions

这个扩展将根据工作空间中的 CSS 文件为 HTML 类属性添加代码补全建议。

Open in Browser

我不清楚为什么这不是 VSCode 的内置功能,但这个扩展可以让你在浏览器中打开你的 html 文件。

SVG Viewer

如果要在 VSCode 中直接预览 SVG 图像和图标,请安装此扩展。

Random

不是最常用的扩展,但是有时候能够用它创建一个随机数,地址或电话号码。

BEM Expand

BEM Expand 允许在 HTMl 和 JSX 文件中扩展 BEM 类。

Auto Close Tag

像 Visual Studio 或 Sublime Text 那样,添加 html/xml 标签的结束标签。

Auto Rename Tag

此扩展将自动重命名开始和结束 html/xml 标签。

Alignment

就像 Sublime Text 3 的扩展 Alignment Package 那样,此扩展将对齐代码。

原文:A Collection of Useful Extensions for VSCode - Petr Tichy - Front End Developer - Melbourne

扩展阅读:

欢迎关注

  • 知乎专栏「极光日报」,每天为 Makers 导读三篇优质英文文章。
  • 网易云电台「极光日报」,上下班路上为你读报。
  • 微信公众号「极光开发者」,每周两篇技术类干货