阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      Markdown 插件

      Markdown 插件可能有很多方向;

      比如

      • 写邮件的Markdown Here
      • VScode/Sublime插件
        • MarkdownEditing:https://github.com/SublimeText-Markdown/MarkdownEditing
        • OmniMarkupPreviewer:https://github.com/timonwong/OmniMarkupPreviewer
      • vim的markdown插件
        • 如:vim-markdown / vim-instant-markdown / python-vim-instant-markdown

      下面是以VScode为蓝本的插件介绍;

      对于 Markdown 文件编辑来说,无非就是需要:

      • 实时预览
      • 生成 HTML 文件
      • 生成 PDF 文件
      • 语法检查(因为 Markdown 的标记相对简单,基本不用进行检查。)
      • 其他功能扩展(比如数学公式生成、目录生成器、样式修饰、脚注、其他特定功能或样式)

      因为 Markdown 和它的扩展没有形成最终的统一,所以各种 Markdown 的扩展也是各做各的,各个平台支持力度也是不尽相同,往往都是一个扩展在这个平台支持,在另一个平台就不支持了。所以你在写 Markdown 的时候要考虑文章存放的平台,或者最终的用途(比如生成 HTML、PDF)是否能准确解析,不然会白费力气的:不支持的标记会变成普通文本使得看上去怪怪的。

      那我们就开始一一来看看好了:

      Markdown 实时预览

      新版的 VScode 已经支持 Markdown 实时预览了。所以你是否需要预览插件就看你自己了,不过列出的几个:

      1. Instant Markdown
        • 以静态服务器的形式解析 Markdown 文件,会自动打开浏览器并支持实时预览。虽说很好用,但是总是突然就弹出浏览器界面,总是会让你心烦意乱。
      2. Auto-Open Markdown Preview
        • 随着新版 VScode 对 Markdown 的预览,基本不需要这款插件了,因为它的功能和 VScode 提供的预览方式是一样的。都是在侧边(编辑区)预览解析后的 Markdown 文件。
      3. Preview

      Markdown 转 HTML

      Markdown 转 HTML 可能是不少小伙伴需要的,实现方式上也很多,但就在 VScode 里直接实现来说,还是很有必要的,尤其当你不会构建转换环境的时候。

      1. Copy Markdown as HTML
        • 目前就看到这一款插件(如你有更好的选择,记得留言告诉大家哦!),不过它用起来不是很方便。你需要创建一个空的 HTML 文件,然后到 markdown 文件里按 Ctrl+Shift+P 呼出命令栏,然后选择Markdown: Copy as HTML命令得到 HTML 文件(这会儿 HTML 在剪切板里),然后再回到先前的 HTML 文件中粘贴并保存,这样才能最终转换成 HTML 文件,而且解析样式不能通过设置来自定义,要修改样式,要自己写 CSS 样式。不管如何到底也是成功装换了。

      Markdown 转 PDF

      我们都知道 Markdown 文件没有解析器是不能愉快阅读的(它不能在浏览器中打开直接解析),比起让人下载 Markdown 阅读器,不如直接转成 PDF 直接些,

      相对原始 Markdown 阅读起来更容易些。做到写的人容易,读的人也容易,你好我好大家好!

      • Markdown PDF

        • 这个插件可以把你在编辑区打开的 Markdown 文件转换成 PDF 文件,而且命令就在鼠标右键菜单里:Convert Markdown to PDF使用起来非常方便,它会直接生成到 Markdown 所在的目录里(可通过设置指定生成目录(路径))。
        • 它还支持通过设置控制样式或者其他的显示(隐藏)内容。 设置:文件》首选项》设置》Markdown-pdf configuration里面有各项参数,你可以按照自己的需求进行自定义设置。其中:“markdown-pdf.outputDirectory"项就可以设置 PDF 生成保存的路径,默认是保存到当前路径 (markdown 文件所在路径)。它算是比较人性化的插件了吧。
      • md2pdf

      Markdown 转 Word 及其他格式

      我觉得转成 Word 也是某些小伙伴的刚需,所以也列出来:

      • vscode-pandoc
        • 算是专门转换 Markdown 的插件吧,支持把 Markdown 转成 HTML、PDF、Word,还没试过,大家可以看看。
      • md2reader
        • 把 Markdown 转换成EPUD/MOBI格式

      Markdown 辅助编辑插件

      Markdown 在某些方面还是比较难编辑的,比如:表格(相当于 HTML 的 table 标签) ,因此,就有了辅助编辑插件了,主要是通过快捷键或者鼠标右键菜单快速插入或者生成 markdown 标记。以方便不太熟悉 Markdown 标记的人或者想要快速生成标记的人的需求。

      毕竟 VScode 也只是在编辑器的导航器中内置了加粗、斜体、删除线、列表等 4 个插入标记的功能按钮,并不能满足需求,所以你和我一样比较懒的话,辅助编辑插件是个不错的选择:

      • Markdown Shortcuts

        • 这个插件就支持通过快捷键和鼠标右键菜单快速生成 Markdown 标记, 它基本覆盖了标准的 Markdown 的所有标记符,很是方便,尤其是快速生成表格标记方面。
      • Markdown TOC

        • 这是生成目录用的(生成 [TOC] 标记)但是 [TOC] 并不是标准 markdown 标记,你要用的话要考虑下平台支持因素。

      顺便说下:Markdown TOC这个插件做得不完美,它的鼠标右键菜单会在所有的语言的编辑区中出现(当你点击鼠标右键的时候),这会让人很烦;还有更烦人的是,使用这个插件,如果你是HEXO写博客的,点生成TOC时候,会把配置文件头都当作正常内容处理了;不怎么好;

      Markdown 扩展标记支持插件

      某些特殊的 Markdown 扩展标记是无法解析出来的(或者插入标记)。这就需要 Markdown 扩展标记插件来帮忙了。

      • Markdown+Math
        • 一个比较全面的工具吧,支持生成 HTML,支持插入标记,可能它的特色功能是数学公式、图形的插入解析,所以,如果你有这方面的需求,可以下下来使用。
      • Evernote
        • 支持把印象笔记的文件以 Markdown 格式打开(印象笔记是不支持 markdown 文件的)。
      目录
      目录