创意电子

标题: 提高开发效率的几款Vscode的一些插件，真的很香 [打印本页]

作者: vaysalee 时间: 2021-8-20 17:01
转发了

作者: 不知为何有些许凄凉 时间: 2021-8-20 22:05
只有最后一个没用过[捂脸]

作者: 大鹏和娜娜 时间: 2021-8-21 22:16
转发了

作者: 琉璃谷的小鱼儿 时间: 2021-8-21 23:02
转发了

作者: 新年快乐www 时间: 2021-8-22 02:57
最后一个什么效果啊没看出来

作者: 發發嗨 时间: 2021-8-22 22:47
转发了

作者: 知码 时间: 2022-2-11 05:01
标题: 提高开发效率的几款Vscode的一些插件，真的很香
前言

俗话说：工欲善其事，必先利其器。
一个高效的开发者离不开一个优秀的开发工具，对于前端开发来说我个人保举的开发工具是: VS Code
官网地址如下：
https://code.visualstudio.com/
那今天就来先容一下几款在 vscode 中比较实用的插件。
1、Live Server 静态服务器

使用live server 插件本地开发实现热加载，实时查看网页效果

在 HTML 文件上点右键，选择 Open With Live Server

当改动 HTML 的时间，浏览器中的内容也会时时更新。
2、Code Runner 代码运行器

Code Runner已经有了超过400万的下载量，支持了JS, TS, Node.js, Python, C++, Java, PHP, Perl, Ruby, Go等超过40种的语言。

以js为例，打开一个js文件

3、Image Preview 图片预览

在编写css，再也担心写错图片地址啦！其支持在html和css文件内里，当有使用图片路径的时间，在左边实现小的预览器，一眼就知对与错。

具体用法，在使用到图片的时间，在编辑器的左边会出现图片的预览

还是非常方便的，可以实时地检查出哪个图片的路径出错了
4、Import Cost 依靠包大小提示

这个插件可以让我们看出依靠的第三方包体积有多大。也挺方便

安装完成之后，打开一个有依靠包的文件，可以看到依靠包的大小

5、Wrap Console Log 快速的输出变量

这个功能对我来说真的是太好用了，为了快速输出变量，我都界说好了一个代码段，还有快捷键。有了这个插件就可以省心了

总结

以上就是我保举给大家的几个比较好用的插件。如果大家有更好的插件可以保举一下，大家一起学习。
另外，vscode 安装上插件之后，会比较吃内存，可能会卡，大家按自己的实际情况来安装插件。
末了祝大家工作愉快

欢迎光临创意电子 (https://www.wxcydz.cc/)