VSCode 的这些黑科技 99% 的人都不知道

水深无声 2022-12-04 01:25 210阅读 0赞

VSCode 已经成为大家常用的编码工具了，但是得益于它的插件生态机制，其实 VSCode 能覆盖的面远比你想象中的大得多，今天笔者就来介绍其中一些相当给力的使用场景。

## 不只是 markdown ##

首先介绍插件 markdown-preview-enhanced，它的核心功能当然就是用来写 markdown 的，你无需再多下甚至说去购买一个软件，这个插件提供的功能个人觉得已经完全够用了。

接下来笔者要介绍两个这个插件很好用的功能：

1.  生成各种手绘图、流程图、时序图等
2.  生成 PPT

### 生成各种图 ###

我们平时写文档、文章或者 PPT 的时候经常会需要用到一些流程图等等，有时候不知道去哪里能画这些图，有时候可能也懒得打开各种书签，这时候这个功能就可以派的上用场了。

一些很简单的语法你就可以快速生成一个流程图出来，并且省了一些拖拖拽拽的功夫。

![format_png][]

除了生成流程图，你还可以生成另外七种类型的格式，有兴趣的可以自行去官网了解用法

![format_png 1][]

### 生成 PPT ###

每次做 PPT 都是很烦躁的，需要找各种模板、背景，然后调整内容的样式，总之在格式上需要浪费挺多时间，这时候这个功能就能帮助你了。

![format_png 2][]

用上这个功能，写 PPT 就和写 markdown 和 HTML 一样简单了，你可以直接通过 CSS 去修改样式，再也不需要找各种按钮来调整样式了。

## 更牛逼的流程图 ##

draw.io 想必很多读者都拿来用过，画流程图那是一等一的好工具，并且还是免费使用的，很多作者的文章中都有这个工具产出的流程图身影。

现在我们也能在 VSCode 里直接使用这款工具了，并且更加简单方便。

你只要新建一个以 `.drawio` 为后缀的文件，你就可以直接在这个文件上全套使用 drwaio 的功能了，还不需要网站上那一套初始化的流程，使用过程中完成和网站没有任何的区别。

![format_png 3][]

这个还不算完，我们画好流程图一般都是需要拿出来用的，多数情况下需要将文件导出为图片。这个插件直接能让我们画完流程图就立马保存为图片，你只需要将刚才的后缀改为 `.drawio.png`

![format_png 4][]

当然了，如果后续我们发现流程图需要更改，插件也是支持直接修改文件的。

## 最后 ##

大家如果还在 VSCode 上发现什么提高生产力的工具，欢迎在评论区放出你的宝藏产品。

### 学习交流 ###

*  关注公众号【前端宇宙】,每日获取好文推荐
 *  添加微信,入群交流

![format_png 5][]

“在看和转发”就是最大的支持

[format_png]: /images/20221123/49441cfdd5b44580b7ea6bee55f89cb7.png
[format_png 1]: /images/20221123/0d4a5b1516774cf5a093ce902417e198.png
[format_png 2]: /images/20221123/0e9d735e471246cb826bdf6a5cd7dc5c.png
[format_png 3]: /images/20221123/3003a8cdd4484cfbad32aa12b7b873f0.png
[format_png 4]: /images/20221123/c03b413eb4544646a59bd6d327ad7388.png
[format_png 5]: /images/20221123/5c8514028c304b58ac50df5b93ce3d98.png

发表评论取消回复

表情：

评论列表（有 0 条评论，210人围观）

还没有评论，来说两句吧...

相关阅读

相关 @Autowired的这些操作，你都知道吗？

前言最近review别人代码的时候，看到了一些`@Autowired`不一样的用法，觉得有些意思，特定花时间研究了一下，收获了不少东西，现在分享给大家。也许`@Au

雨点打透心脏的1/2处/ 2024年04月07日 14:15/ 0 赞/ 83 阅读

相关超实用：大部分的人都不知道的一个Python技巧

今天给大家分享一个Python开发实用小干货：如何将Python公共函数设置全局可用。 ![在这里插入图片描述][391f9dc561ae48f48f8b99bf9b8b7b

旧城等待，/ 2023年09月27日 09:58/ 0 赞/ 31 阅读

相关学习CSS,这些内容你都不知道吗？

CSS介绍引入css样式表方法 CSS选择器 CSS常用属性 CSS介绍： CSS全称是（Cascading Style Sheet）层

拼搏现实的明天。/ 2022年12月28日 00:36/ 0 赞/ 290 阅读

相关请求的方式，有这些，你都知道？

要访问服务器首先需要由客户端主动发出请求，在实际的操作中，我们可以通过多种方式向服务器发起请求。根据不同的场景需求，使用不同的请求方式可以达到不同的效果。请求的方式

Love The Way You Lie/ 2022年12月26日 04:53/ 0 赞/ 142 阅读

相关 VSCode 的这些黑科技 99% 的人都不知道

VSCode 已经成为大家常用的编码工具了，但是得益于它的插件生态机制，其实 VSCode 能覆盖的面远比你想象中的大得多，今天笔者就来介绍其中一些相当给力的使用场景。

水深无声/ 2022年12月04日 01:25/ 0 赞/ 211 阅读

相关 90%的人都不知道的前端性能优化技巧（下）

前言相关概念了解请移步 [这些前端性能优化的知识我从来不告诉别人（上篇）][Link 1] 本文干货居多噢引言当遇见“你为性能优化做了哪些事情”，

落日映苍穹つ/ 2022年10月07日 02:58/ 0 赞/ 192 阅读

相关 90%的人都不知道的前端性能优化技巧（上）

![19ab42096f91ab4f19a53efc1547d5c3.png][] 引言反复看下以下三个问题。有木有不同的人问过你：什么是前端性能优化？

谁践踏了优雅/ 2022年10月05日 10:53/ 0 赞/ 237 阅读

相关 CSS 的黑科技

> 原文来自：[https://jellybool.com/post/css-that-you-may-not-know][https_jellybool.com_post_c

约定不等于承诺〃/ 2022年08月03日 04:26/ 0 赞/ 212 阅读

相关收藏！这些数据获取方式，一般人不知道

在这个用数据说话的时代，能够打动人的往往是用数据说话的理性分析，无论是对于混迹职场的小年轻，还是需要数据进行分析和研究的同学，能够找到合适的数据源都是非常重要的。特别是想要对一

矫情吗；*/ 2022年07月16日 15:18/ 0 赞/ 274 阅读

相关气液增压泵这些特点 99%的人不知道

气液增压泵，空气增压泵是一款以液压油、水及大部分化学腐蚀性液体为介质的增压产品，利用大面积活塞的低气压产生小面积活塞的高液压。气液增压泵已广泛应用到各个行业，其特点众多，下面就

╰半夏微凉°/ 2022年01月15日 06:13/ 0 赞/ 219 阅读