分享Visual Studio Code的开发过程中常用的插件 - Web前端
作者:98wpeu发布时间:2026-09-16分类:网页前端技术浏览:4

无论你是经验丰富的开发人员还是刚刚开始第一份工作的初级开发人员,你都会想让自己的开发工作尽可能轻松一点。正确的工具使用则可以帮助你实现这个目标。 如果你选择使用Visual code作为IDE,你就可以使它符合你的偏好选择。实现此目的的一种方法是安装正确的插件。为了让你的生活尽可能的简单,你可以添加很多你想要的内容。 你使用的插件将会对你的工作效率以及工作方式产生很大的影响。这就是为什么我们要运用Visual Studio Code插件列表的原因。
我们改变工具,工具再改变我们。——杰夫·贝佐斯(Jeff Bezos)请注意,所有这些插件都可以在 Visual Studio Marketplace 上免费获得。
Visual Studiointellicode
下载超过320万次的Visual Studio Intellicode是Visual Studio下载次数最多的插件之一。而且,在我看来,它是你能用到的最有用的插件之一。
这个插件旨在帮助开发人员提供智能的代码完成建议而构建的,并且已预先构建了对多种编程语言的支持。 Visual Studio Intellicode使用机器学习技术来观察和查找众多开源GitHub项目中使用的模式,并在编码时提供建议。
git Blame
这是谁做的?!
有时候,你需要知道是谁写了这段代码。好吧,Git Blame进行了救援,它会告诉你最后接触一行代码的人是谁。最重要的是,你可以看到它发生在哪个提交中。
这是非常好的信息,特别是当你使用诸如特性分支之类的东西时。在使用特性分支时,你可以使用分支名称来引用票据。因为Git Blame会告诉你哪一个提交(也就是哪个分支)的一行代码被更改了,所以你就会知道是哪一个票据导致了这种更改。这有助于你更好地了解更改背后的原因。
PRettier
PrettIEr是开发人员在开发时需要遵循一组良好规则的最佳插件之一。它是一个引人注目的插件,让你可以利用Prettier软件包。它是一个强大的、自以为是的代码格式化程序,可以让开发人员以结构化的方式格式化他们的代码。
Prettier与javascript、TypeScript、html、CSS、Markdown、GraphQL和其他现代工具一起使用,可以让你能够正确地格式化代码。
JavaScript (es6) Code Snippets
每个略更新的网页开发人员可能都使用过各种Javascript堆栈。无论你选择哪种框架,在不同的项目中键入相同的通用代码应该会减少你的工作流程。
javascript (ES6)Code Snippets是一个方便的插件,它为空闲的开发人员提供了一些非常有用的javaScript代码片段。它将标准的JavaScript调用绑定到简单的热键中。一旦你掌握了窍门,你的工作效率就会大大提高。
sass
你可能已经猜到了,这个插件可以帮助正在使用样式表的开发人员。一旦开始为应用程序创建样式表,就一定要使用Sass插件。该插件支持缩进的SASS语法 自动设置语法制导 、自动补全和格式化。
在样式方面,你肯定希望将此工具包含在你的工具集中。
Path Intellisense
Path Intellisense是Visual Studio代码之一,它可以为你的开发提供有保证的生产力提升。如果你同时处理许多项目,使用了太多不同的技术,那么你肯定会需要一个可以帮你记住路径名的便捷工具。这个插件将为你节省大量的时间,否则将浪费在寻找正确的目录上。
Path Intellisence最初是用于自动完成文件名的简单扩展,但它后来被证明是大多数开发人员工具集中的宝贵资产。
Debugger for Chrome
如果需要调试JavaScript,则无需离开Visual Studio Code。微软发布的chrome调试器允许你可以直接在Visual Studio Code中调试源文件。
ESLint
ESLint插件将ESLint集成到Visual Studio Code中。如果你不熟悉它,ESLint就会作为一个静态分析代码的工具来快速发现问题。
ESLint发现的大多数问题都可以自动修复。ESLint修复程序可识别语法,因此你不会遇到由传统查找和替换算法引入的错误。最重要的是,ESLint是高度可定制的。
svg Viewer
SVG Viewer扩展添加了许多实用程序,可用于在Visual Studio Code中使用SVG。这个插件使呈现SVG文件和查看它们的外观成为可能,而不必离开编辑器。此外,这个插件还具有用于转换为PNG并生成数据URI模式的选项。
Themes
最后但并非最不重要的是Themes。既然你每天都会看到你的编辑器,那为什么不把它做得尽可能的漂亮呢?有大量的自定义插件可以改变侧边栏的配色方案和图标。一些流行的Themes是免费提供的,分别是 One MonokAI , One Dark Pro 和 Material Icon 。
相关推荐
- 汇总IOS下奇葩BUG以及iframe嵌套页面带来的一些困扰 - Web前端
- 在JavaScript中,将存储布尔值的变量转换为“0”或“1”的常用方法 - Web前端
- 这些CSS3动画库,您是否都了解和应用过? - Web前端
- 收藏JavaScript中一些常用的代码性能优化技术【下篇】 - Web前端
- .vue文件里的export default解释 - Web前端
- 回顾JS规范中的相等、严格相等、零值相等以及同值相等 - Web前端
- 对于vuejs里import引用模板路径“@”的解释 - Web前端
- 聊聊JS里区间取随机数的方法:Math.random()和Math.floor() - Web前端
- 谷歌浏览器声明:2020年12月在Chrome中告别Flash - Web前端
- 学习下JS里如何实现类型转换:隐性转换和显性转换 - Web前端
- 网页前端技术排行
-
- 1[Web前端]用javascript实现默认图片替代未显示的图片 - Web前端
- 2分析Iconfont-阿里巴巴矢量常用图标库 - Web前端
- 3jQuery实例教程:制作网页中可折叠的面板 - Web前端
- 4【第六章】Foundation之按钮和下拉功能 - Web前端
- 5基于jquery的滚动条滚动固定div(附演示下载) - Web前端
- 6jQuery编写widget的一些技巧分享 - Web前端
- 7分享精心挑选的12款优秀jQuery Ajax分页插件和教程 - Web前端
- 8jQuery实现鼠标移到元素上动态提示消息框效果 - Web前端
- 9在Mac/PC上远程调试iPhone/iPad上的网页 - Web前端
- 最近发表
-
- WordPress随机显示特色图片插件:Random Post Thumbnails
- KeePass实现Chrome浏览器自动填充密码方法一
- LNMP一键包nginx 301强制跳转到https教程
- KeePass实现Chrome浏览器自动填充密码方法二
- #建站# 免费的VPS管理软件Xshell8/Xftp8中文版下载
- 使用Xshell 8连接VPS教程_电脑登录vps的方法
- WordPress评论界面添加烟花????效果
- 不同浏览器书签同步方案:坚果云+Floccus_详细使用教程
- iOS端KeePassXC客户端APP:Strongbox Password Safe
- 给WordPress评论中的Gravatar头像图片添加ALT属性


