|
|
马上注册，结交更多好友，享用更多功能^_^
您需要 登录 才可以下载或查看，没有账号？立即注册
x
本帖最后由 Hello. 于 2020-7-19 13:20 编辑
本次 ，让沐沐带领你见识那些让开发效率飞起的 VS Code 插件 ！
2020.6.25 修订说明：据说小师妹要根据本篇文章做一期视频哦 ~ 特意重新排版，望大家多多支持小师妹 ！ 2020.6.26 修订说明：增加推荐 ；修改了一些错误 ；正准备提供插件打包下载 2020.6.27 修订说明：打包已完成 ，正在完善（ 就等小师妹一声令下啦 ）；增加了三个动图演示 ；准备出安装教程
2020.6.28 修订说明：提供蓝奏云打包链接下载（ 回复可见 ）
今天 ，我们推荐几款 VS Code 的插件 
VS Code 可以说是 宇宙第一IDE -- vs 的亲儿子 ，功能十分强大 ，并且 启动速度比 VS 快了（十）几倍
这样强大的文本编辑器 ，如果有合适的插件搭配 ，会不会更完美 ？ vim 大佬留步，毕竟 vim 快捷键可以导入到这里 ~ 嘿嘿 
不妨先看看作者的部分插件 ：
几个语言插件 & Java 工具包 & 几个增强 前端插件占多数
所以 ： 今天主要推荐的是前端的插件（ 其他语言可直接对应插件包 ）
所有的插件 都可在商店里找到，我附上名字，搜索下载就 OK
一 、汉化插件（ Chinese language ）
没什么可说的 ，也不需要配置 ，需要汉化就下载（ 不会像 pycharm 汉化容易崩溃 ）
二 、字体（ Fira code ）
这我必须给你们洗脑 ，自从我看到这款字体 ，再也没碰过别的 ，这简直就是为写代码而生 ！干净整洁美观护眼 ！
比较图（ 左 Fira code ）
代码图
这字体是我在 GitHub 里面看到的 ，VS Code 里面应该没有 ，下载下来需要安装配置
地址： 传送下载
三 、CSS 高亮（ Color Highlight ）
是不是内置的我忘了 ，如果没有就下载一下 ，这看起来很直观 
四 、快速运行（ Code Runner ）
可以将代码快速运行，不用搭建环境，支持
C , C++ , Java , JS , PHP , Python , Perl , Ruby , Go , Lua , Groovy , PowerShell , CMD , BASH , F# , C# ,
VBScript , TypeScript , CoffeeScript , Scala , Swift , Julia , Crystal , OCaml , R , AppleScript , Elixir ,
VB.NET , Clojure , Haxe , Obj-C , Rust , Racket , Scheme , AutoHotkey ，AutoIt , Kotlin , Dart , Pascal , Haskell , Nim
下载量已超过 400w+！ （ 数据截至 2020.6.26 ）
五 、彩色括号（ Bracket Pair Colorizer ）
自动识别标色成对括号 ，使用不同颜色标记不同括号 ，多括号时一目了然 （ 如图，我好像弄的 js .. ）
六 、自动闭合（ Auto Close Tag ）
HTML 中 ，写出首标签后 ，尾标签会直接出现（ 不推荐小白使用 ），还有几个特殊功能需要自己配置（ 如 gif ）
七 、只改一次（ Auto Rename Tag ）
HTML 中 ，有时需要修改标签 ，但是隔得太远又找不到（ 隔千行你难道去找 ？）
此插件在修改标签时 ，会 同时修改首尾 两个标签 ，解决了困扰已久的问题（ 如 gif ）
八 、自动补全文件路径（ Path intellisense ）
不多说了，直接看吧（ 如 gif ）
九 、实时运行 js（ Quokka.js ）
这个可就厉害了 ，代码写完直接出结果 ，结果还能随着代码修改而实时修改 （ 如 gif ）
十 、实时检查（ Code Spell Checker ）
拼写错误实时监测 ，适用于英语不好的小白 ~
十一 、定制图标 、树状展示（ Vscode Great Icons ）
一目了然 ，再也不担心区分不开 不同类型文件啦（ 如图 ）
十二 、代码自动补全（ Visual Studio Intellicode ）
划重点 ，代码自动补全 ！代码自动补全 ！用了你就知道多强大 ！（ 如 gif ）
十三 、调试（ Debugger for Chrome ）
如果你想调试 JavaScript 程序 ，你可以不必离开 VS Code 开发环境 。
Debugger for Chrome 这款插件就可以做到这点 ，它由微软发布 ，允许你在 VSCode 中直接调试网页源文件
该插件主要利用 Chrome 所开放出来的接口来实现对其渲染的页面进行调试
十四 、实时颜色显示（ Color Picker ）
上图感受一下（ 特别直观 ）
十五 、自动格式化 （ Prettier - Code formatter ）
小师妹在视频里介绍了哦 ，可以在保存时按照自己的偏好来格式化代码 ~
十六 、网页运行 （ live server ）
好多大牛都推荐的插件 ，好不好用只有尝试才知道 （ 如 gif ）
十七 、为什么我要把 js 成品 格式化为一行 ？
给你们看看不格式化成一行的成品
800 行 + ，而且是每行都写满 ，看着很乱吧 ，如果按照格式来，起码 3000 行 +
如果成品不需要修改更新 ，建议都格式化成为一行（ 脚本除外 ）
并且 js 文件的空格占字节的 ，写成一行能缩小文件大小 ，文件越小效果越好
你可以通过插件来把 js 格式化成一行 / 恢复多行 （ 上期 Chrome 插件前端助手也可以 ）
蓝奏云插件打包（ 附安装教程 ）下载： 回复可见
要是我没写到的，可以看看开头那两张图，自己体验一下，如果有更好的，欢迎在评论区推荐！
写的有点匆忙，不好意思！
声明：原创作品，如有侵权，请联系删除；如有雷同，纯属巧合；非商业推荐，无广告嫌疑
转载请注明出处及作者
统计：
准备及体验时间：3 天
写作时间：2 天
整理时间：1 天
字数：13900 字节
作者：曦沐
特别鸣谢：
所有支持【安全时刻】&【工欲善其事】系列以及支持安全实验室的朋友们！
写这篇文章耗费了大量心血，希望各位支持一下！
如果喜欢，记得 收藏+评分吖，谢 
如果有收获，别忘了评分
|
评分
-
查看全部评分
|
[复制链接]
( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)
狗仔卡
发表于 2020-5-5 20:12:13
置顶卡
千斤顶
显身卡
楼主
发表于 2020-5-5 20:18:13
