VScode 打造 Markdown 编辑器

在之前的博文中我分别介绍了 Markdown 的基础语法和数学公式语法,本文主要介绍使用现在非常流行的 Vscode 代码编辑器进行 Markdown 书写的一些配置。

插件

这里主要推荐三款核心插件,其余的可以按需选择。

  • Markdown All in One 目前 Vscode 最流行的 Markdown 语法解析器。
  • Markdown PDF 使用的 Markdown 文件渲染导出插件。
  • Markdown TOC 一款针对 Github 等平台自动生成文章目录的插件(目前主流的博客平台如 CSDN 已经不需要自己在文中生成目录了)。

安装方式也很简单,在 Vscode 的左侧导航栏最后一个联网搜索 markdown 关键字,找到对应插件点击安装(下图 install)即可,上述几个插件都是高排名插件,最前面就能找到。步骤如下图。

Markdown All in One

就像插件的名字一样,将之前很多其他编辑器需要多插件配合的 Markdown 环境整合为一个,支持多种 Markdown 语法、实时预览、快捷键解析等功能。

安装之后打开以.md或者.markdown为后缀结尾的 Markdown 文件,就可以右侧窗口实时预览渲染效果,当然,也可以使用Ctrl+B这样的快捷键直接进行一些 Markdown 语法操作,这里就是自动补**content**语法标记。

具体的语法可以参考本文引言中的链接,安装后编辑器界面如下。

Markdown PDF

该插件可以实用地将 MArkdown 文件渲染的显示结果(基于 HTML)导出为 HTML、PDF、PDG、JPEG 等格式的文件,而不需要用户自己处理繁琐的图片路径等问题。

安装后在 Markdown 文件的编辑界面中右击即可显示菜单栏,在其中的如下几项就是该插件提供的,点击即可导出,这表示当前 Markdown 文件目录下生成对应 PDF,文件名相同,其他需要的可以自行对插件进行配置。

对当前教程导出后,某一页结果如下。

Markdown TOC

在一些平台如 Github 渲染 Markdown 文件是不能自动目录的,需要自己手写,而繁琐的 HTML 语法又不太方便,使用该插件即可快速生成自动目录。

使用方法很简单,在需要添加目录的地方右击菜单栏,可以看到如下几个 TOC 插件功能,前面两个是章节自动编号(用的不多),后面两个则是自动增加或者更新目录和删除目录。

该插件使用可能会有问题,其中比较常见的是目录格式异常,这是因为**该插件解析行尾是使用\n而 Vscode 的默认行尾标志是auto所以会生成异常如下。

这里解决方法很简单,通过修改 VScode 编辑器的默认行尾符号即可。编辑器左下角点击设置—进入 setting 配置—搜索 eol—修改文件行尾符号为\n即可。

这是,生成的目录格式正确且渲染正常,如下图。

这里还需要进行一些配置,主要针对一个需求:我并不需要对一级标题列入目录中,且想要手动进行目录编辑,但手动修改目录后插件会自动更新该区域。

这是因为插件默认配置目录是自动更新的,这里只需要对插件进行配置即可,具体操作如下:找到安装的插件—点击扩展配置—对打开的配置文件最后两个带auto的自动选项取消勾选。

此时就可以修改为自己需要的目录格式了,如下图。

补充说明

本文主要介绍如何使用 Vscode 进行 Markdown 编辑器的配置, 由于本文发于 CSDN 就没有添加文章目录,欢迎点赞收藏本文。

更多推荐

Markdown-VScode打造Markdown编辑器