vscode使用sass_十款适合前端工程师的VSCode插件推荐

67cdcb2444862c0e9eb65c3bdb303020.png
Visual Studio Code,可以说是近年来最好的代码编辑器(如果您不相信,请快速浏览一下)有很多扩展,它们带有一种Extension-store(就像App store for你的应用程序)名为Market Place。有调试代码,格式化代码,键映射,开发技术(如heroku,github,docker,azure),IDE主题,代码链接,代码片段和许多其他类别的扩展。

本文适用于所有开发人员,但主要适用于使用标记语言,样式表和Javascript及其众多框架的开发人员。提交真正令人感兴趣的VS Code Extensions以帮助实现高效和简单的前端开发(这也显示了社区如何支持VS Code)。在本文中,我将简要介绍2018年必备的VS Code Extensions,以便您可以对您的IDE进行操作。

1. Live Server

e197105e63f83690cc3dd93505de7fd7.png
1df4d492fbbad4a41c47c43e1aec6e6d.png

Ritwick Dey的这个很酷的扩展为您的静态和动态页面创建了一个开发本地服务器。任务栏上会出现一个上线按钮,因此您可以将代码无缝地作为开发服务器运行。它还带有一个闪亮的功能:Live Reload,可以在您保存工作后立即重新加载页面。非常棒。

2.Live Sass编译器

05ba11a969e672b95120b166797a9e06.png

Ritwick Dey的这个扩展将你的scss文件编译成css文件,就像node-sass一样快速和实时。通过任务栏上的watch-my-sass按钮,它可以在首选浏览器中显示已编译样式的实时预览,同时还具有实时重新加载功能。

3.Javascript代码片段

af6030d9ce178b5c57d387fae7b5615a.png

Charalampos Karypidis的这一扩展包含超过200万的下载和计数,提供了ECMAscript 6语法中的javascript代码片段,同时使用了javascript文件和其他文件,如Typescript,Javascript React,Typescript React。

4.NPM

ae53803486f70536de151cd58824ea75.png

这是VS Code上的官方Node Package Manager支持。它有助于以任何可想象的方式管理package.json文件。它标记了已定义但未安装的依赖项的警告,或者已安装但未在package.json中定义的依赖项的警告,它还表示软件包的版本控制存在差异。它还提供了快速运行npm命令和简单的快捷方式。

5.ESLint

41ab515644fc89b4678b2c1411297760.png

这里是你的Javascript和jsx的所有linting。可插拔,并确保您坚持标准做法,如缩进和定位等等。它是VS Code中下载次数最多的扩展之一,下载量近1200万。

6.Prettier

7ef5dedd02fa7e59265d293c82f3e4d0.png

这是Esben Petersen非常受欢迎的扩展。它目前拥有近400万次下载。它有助于格式化Javascript代码,颜色关键字,使您的代码易于阅读。有类似的扩展,其中一个受欢迎的是美化(也可在市场上买到)

7.CSS Peek

726c3d6b82086aeceda7ae63f500e176.png

Pranay Prakash的这个非常有用的扩展通过识别和枚举已经应用于所述元素的不同样式来帮助我们处理标记语言类字符串和ID。这非常有用,因为它为我们节省了大量时间来回传递html和css文件,并且对于不喜欢分屏的开发人员来说也很方便。

8.Angular 片段

7cec7cefa7c9dde5adaae5d054691e9b.png

这是VS Code的官方Angular 6片段扩展。它遵循Angular样式指南,有助于使Angular的工作变得更加容易。它具有代码可预测性功能以及与新版本6兼容的自动完成功能。它支持打字稿,服务工作者,RxJS,ngRx甚至Angular材料,如果你使用Angular并且还没有这个,你应该考虑在做了。

9.Vetur

222a22c2642a45cee7f600d20a9e25ea.png

这是VS Code的官方Vue js扩展。凭借令人印象深刻的500万次下载,Vetur一直致力于帮助Vue js开发更轻松。它具有错误检查功能,代码自动完成功能,并且还支持提供代码段。 Vue开发人员还可以在这里获得有关聚会和会议的最新更新,真的很酷。

10.适用于Chrome的调试器

afbf768041f67998165fec787770ebce.png

这是Chrome的VS Code官方调试器扩展。目前是VS Code市场上最常用的扩展之一。它可以帮助您直接从VS Code调试在Chrome浏览器中运行的js文件,这有多酷?它拥有众多专门的贡献者,并且为前端开发人员提供了很多便利。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值