乐趣区

关于前端:使用-Vue-开发的这-7-个-VS-Code-插件万万不可错过

作者:Ahmad shaded
译者:前端小智
起源:sitepoint

有幻想,有干货,微信搜寻 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。

本文 GitHub https://github.com/qq44924588… 已收录,有一线大厂面试残缺考点、材料以及我的系列文章。

在 VS Code 中增加好用的插件能够进步咱们的开发效率。这些能够帮忙咱们格式化,扩充性,执行最佳实际的代码形式,主动实现一些琐碎的事件。好了,费话不多说,那咱们开始吧!

Vetur

Vetur 反对 .vue 文件的语法高亮显示,除了反对 template 模板以外,还反对大多数支流的前端开发脚本和插件,比方 Sass 和 TypeScript,残缺的反对高亮的语法如下所示:

Vetur 保护得很好,它甚至还提供了对 Vue3 Typescript 的反对。

对于 Vetur 没有太多要说的了 - 还没应用的,快快下手吧。

ESLint Plugin VueJS

大多数开发人员都相熟 ESLint,这是最风行的 linter 工具之一,它能够帮忙咱们放弃代码与最佳实际统一,并在大型代码库中具备可读性。

VueJS 有本人的 ESLint 插件来查看单个文件组件的语法。我认为它是编写可保护和可伸缩代码的最佳工具之一。

没有什么比看一些旧代码甚至不晓得从哪里开始调试更蹩脚的了。

不必放心!

ESLint 能够帮忙你放弃组织性,并且随着对 Vue3 的反对的减少,你能够编写可扩大的 Vue 我的项目。

Vue VSCode Snippets

这个插件基于最新的 Vue 官网语法高亮文件增加了语法高亮,并且根据 Vue 2 的 API 增加了代码片段。

它非常适合编写疾速 SFC,Vue 指令和快速访问生命周期挂钩之类的货色。

Bookmarks

许多 VSCode 插件只有在大型项目时才真正展现出其全副后劲。

Bookmarks 能够让咱们在代码中标记和命名地位。而后,能够在这些不同的书签之间跳转来进步咱们的开发速度。

为了找到某个个性,咱们须要小心翼翼地上下滚动咱们的文件,这样的日子一去不复返了。

Bracket Pair Colorizer

Bracket Pair Colorizer 为代码中的括号添上一抹亮色。我也十分喜爱这种视觉效果–让代码丰富多彩,而又不会让人分心。

Auto Rename Tag

主动敞开标签,在开始标记的完结括号中键入后,将主动插入完结标记。

每当咱们要更改 HTML 括号对中的一个标签(开始或完结标签)时,Auto Rename Tag 会主动重命名另一个标签。

这个小的优化能够帮忙避免很多谬误,特地是在解决大型模板时.

NPM Intellisense

在导入包时,NPM Intellisense 都会主动实现咱们的 npm 模块。

这样能够节俭咱们记住 npm 模块确切名称的工夫,这也是我必备的插件之一。

~ 完,我是刷碗智,我要去刷碗了,咱们下期见!


代码部署后可能存在的 BUG 没法实时晓得,预先为了解决这些 BUG,花了大量的工夫进行 log 调试,这边顺便给大家举荐一个好用的 BUG 监控工具 Fundebug。

原文:https://learnvue.co/2021/01/t…

交换

有幻想,有干货,微信搜寻 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。

本文 GitHub https://github.com/qq44924588… 已收录,有一线大厂面试残缺考点、材料以及我的系列文章。

退出移动版