【高效】【IDE】VSCode 插件

Docuemnt This 加注释文档

【高效】【IDE】VSCode 插件_第1张图片

选中你的函数名字,按两次ctrl+alt+D;

Better Comments 注释高亮

【高效】【IDE】VSCode 插件_第2张图片

Live Server 实时预览页面

【高效】【IDE】VSCode 插件_第3张图片

Live Server会启动一个本地服务器,实时的获取文件变化,并更新页面,方便用户测试代码。

选择需要浏览的文件,右键开启服务,就可以在浏览器中浏览网页啦

插件配置

"liveServer.settings.host": 127.0.0.1,//设置本地服务的地址

"liveServer.settings.port": 8080,//设置本地服务的端口号

"liveServer.settings.proxy": {

        "enable": true,

        "baseUri": "/api",

        "proxyUri": "http://127.0.0.1:80/"

    }

设置代理服务器的地址为http://127.0.0.1:80/,此地址用api替代

JavaScript Booster 让自己的代码更专业

你有没有怀疑过你写的JavaScript代码?如何让自己的代码更专业?VSCode中的JavaScript Booster可以快速提升你的代码专业度。

这个插件还有很多转换方式,你可以在写完代码后都点击点击,这样慢慢的你代码水平就会提高。

【高效】【IDE】VSCode 插件_第4张图片

Bracket Pair Colorizer 括号匹配

它就会为我们自动标签匹配,括号匹配。从此再也不用花时间再成对标签或者括号上了。

【高效】【IDE】VSCode 插件_第5张图片

Polacode

那如何快速生成漂亮的代码截图,就变成了一个问题,比如我要在博客里放置一个漂亮的代码截图,或者是快速分享到其它网络平台。这个视频会教你使用一个VSCode插件,快速生成漂亮的代码截图。

【高效】【IDE】VSCode 插件_第6张图片

HTML相关

Chinese(Simplified)

Open in Browser

JS-CSS-HTML Formatter

Auto Rename Tag

参考资料

  • https://jspang.com/detailed?id=60

你可能感兴趣的:(高效)