浅谈Vue开发人员的7个最好的VSCode扩展


Posted in Vue.js onJanuary 20, 2021

在Visual Studio中添加正确的VS Code扩展可以让你作为开发者的生活变得更加轻松。
它们可以帮助格式化、可伸缩性、强制执行最佳实践,从而自动化开发过程中许多容易忘记的任务。它们也可以只是有趣的扩展,使我们的代码看起来更漂亮/更容易编写。
作为一个Vue爱好者,我花了很多时间为Vue开发人员寻找最好的VS Code扩展。这里有一些让我的生活变得如此简单的方法。
准备好了吗?

让我们直接切入正题。

Vetur

如果你从这篇文章中下载了一个VS Code扩展,它一定是Vetur。
一个针对VS Code的Vue工具包——它提供了Vue特定的语法高亮显示、通用代码段的代码段,以及所有Vue开发人员都需要的更多内容。
Vetur维护得很好——它甚至还提供了对Vue3 Typescript的支持。
关于Vetur,真的没有太多别的好说的了——明白了吧。这会让你的发展更好。

ESLint Plugin VueJS

大多数开发人员都很熟悉ESLint——这是最流行的linter工具之一,它可以帮助你保持代码与最佳实践一致,并在大型代码库中具有可读性。
VueJS有自己的ESLint插件来检查单个文件组件的语法。我认为它是编写可维护和可伸缩代码的最佳工具之一。
没有什么比查看一些旧代码,甚至不知道从哪里开始调试它更糟糕的了。
ESLint可以帮助你保持组织性,并且随着对Vue3支持的增加,你将会编写可扩展的Vue项目。

Vue VSCode Snippets

Sarah Drasner的VSCode扩展将为你节省很多开发时间。它为常用的Vue用例提供了自动填充的代码片段。用她自己的话来说……
从真实世界使用的Vue的角度关注开发者的人机工程学。其中包括我个人厌倦了打字的部分,以及有助于快速删除的样板文件。
它非常适合编写快速sfc、Vue指令和快速访问生命周期钩子。

Bookmarks

许多Vue开发人员的VSCode扩展直到进入大型项目时才真正展现出其全部潜力。
这就是Bookmarks的工作原理。这个扩展可以让你在代码中标记和命名位置。然后,你可以在这些不同的“Bookmarks”之间切换以提高开发速度。
为了找到某个特性,你需要小心翼翼地上下滚动你的文件,这样的日子一去不复返了。

Bracket Pair Colorizer

Bracket Pair Colorizer确实做到了它说的-它需要匹配括号,并给他们独特的匹配颜色。
虽然这看起来像是一个小细节,但它确实可以帮助你修复讨厌的嵌套错误,也可以帮助你。
我也很享受这样做的视觉效果——让我的代码色彩丰富,又不会让它太分散注意力。
绝对值得一看。

Auto Rename Tag

Auto Rename Tag是一个有用的VSCode扩展,将有助于防止错误出现在你的模板代码。
每当你去改变一个标签的HTML括号对(无论是开始或结束标签),Auto Rename Tag将自动重命名另一个。
这个小的优化可以帮助防止如此多的错误,特别是在处理大型模板时。

NPM Intellisense

当你在Javascript中编写import语句时,NPM Intellisense会自动完成你的NPM模块。
这可以节省你记住一个npm模块的确切名称的时间。
我已经在我的很多项目中使用了它,而且它绝对是我已经变得非常习惯的东西。

结论

总之,有很多VS Code扩展可供Vue开发人员使用。
虽然这个列表中的许多修改在一开始可能看起来微不足道,但这些小的修改可以为你节省大量的开发时间。我强烈建议至少尝试所有的方法。
谁知道呢——你可能会爱上其中的一些。
如果你认为还有其他的VS Code扩展值得在这个列表上——请告诉我!

到此这篇关于浅谈Vue开发人员的7个最好的VSCode扩展的文章就介绍到这了,更多相关Vue VSCode扩展内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Vue.js 相关文章推荐
Vue 的 v-model用法实例
Nov 23 Vue.js
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
浅谈Vue开发人员的7个最好的VSCode扩展
Jan 20 Vue.js
如何在 Vue 表单中处理图片
Jan 26 Vue.js
vue使用echarts画组织结构图
Feb 06 Vue.js
HTML+VUE分页实现炫酷物联网大屏功能
May 27 Vue.js
Vue CLI中模式与环境变量的深入详解
May 30 Vue.js
Vue实现跑马灯样式文字横向滚动
Nov 23 Vue.js
vue代码分块和懒加载非必要资源文件
Apr 11 Vue.js
vue-cli3.x配置全局的scss的时候报错问题及解决
Apr 30 Vue.js
vue实现input输入模糊查询的三种方式
Aug 14 Vue.js
详解实现vue的数据响应式原理
Jan 20 #Vue.js
vue实现简易计算器功能
Jan 20 #Vue.js
vue使用过滤器格式化日期
Jan 20 #Vue.js
Vue实现简单计算器
Jan 20 #Vue.js
vue实现验证用户名是否可用
Jan 20 #Vue.js
vue实现按钮切换图片
Jan 20 #Vue.js
Vue实现图书管理案例
Jan 20 #Vue.js
You might like
完美的2个php检测字符串是否是utf-8编码函数分享
2014/07/28 PHP
php面象对象数据库操作类实例
2014/12/02 PHP
Smarty模板变量调节器用法分析
2016/05/23 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
php中文语义分析实现方法示例
2019/09/28 PHP
PHP code 验证码生成类定义和简单使用示例
2020/05/27 PHP
angularjs学习笔记之完整的项目结构
2015/09/26 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
2016/02/02 Javascript
详解Node.js模块间共享数据库连接的方法
2016/05/24 Javascript
纯JavaScript 实现flappy bird小游戏实例代码
2016/09/27 Javascript
常用的几个JQuery代码片段
2017/03/13 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
2017/11/14 jQuery
react-navigation 如何判断用户是否登录跳转到登录页的方法
2017/12/01 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
2018/05/22 Javascript
Vue使用预渲染代替SSR的方法
2020/07/02 Javascript
Node在Controller层进行数据校验的过程详解
2020/08/28 Javascript
Echarts.js无法引入问题解决方案
2020/10/30 Javascript
[02:34]DOTA2亚洲邀请赛 BG战队出场宣传片
2015/03/09 DOTA
[03:42]2016国际邀请赛中国区预选赛首日现场玩家采访
2016/06/26 DOTA
Python文件操作类操作实例详解
2014/07/11 Python
详解Python中的Numpy、SciPy、MatPlotLib安装与配置
2017/11/17 Python
python将文本中的空格替换为换行的方法
2018/03/19 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
python+pyqt5实现图片批量缩放工具
2019/03/18 Python
10行Python代码计算汽车数量的实现方法
2019/10/23 Python
wxPython实现整点报时
2019/11/18 Python
如何理解委托
2012/01/06 面试题
工程专业应届生求职信
2014/02/19 职场文书
产品销售计划书
2014/05/04 职场文书
淘宝店策划方案
2014/06/07 职场文书
美术第二课堂活动总结
2014/07/08 职场文书
四风批评与自我批评发言稿
2014/10/14 职场文书
2015年社区党务工作总结
2015/04/21 职场文书
三好学生竞选稿范文
2019/08/21 职场文书
Python turtle实现贪吃蛇游戏
2021/06/18 Python
sql注入报错之注入原理实例解析
2022/06/10 MySQL