在 Vim 里为 Markdown 文档展示导航窗格

简介: 在一个很长的 Markdown 文档里要准确跳转到某标题并不容易,如果像 Word 那样有个导航窗格就好了。

假设我们正在 Vim 里编辑一个很长的 Markdown 文档,这时想跳转到另一个章节去查看或编辑内容,可以怎么做?

  1. 查找章节标题。
  2. 上下翻页。
  3. 记得行号,精确跳转(请收下我的膝盖)。
  4. ...

不知你此时感受如何,反正我是无比想念 Word 的导航窗格,各种编程 IDE 的 Outline。

但等等,我们正在用编辑器之神 Vim 诶!无论想弄啥折腾折腾就有了。

最终效果

我的完整 Vim 配置托管在 GitHub,可供参考:config-files

vim-markdown-outline.png

实现步骤

安装 tagbar

这里我们借助于 tagbar 插件实现导航窗格。当然 tagbar 的功能远不限于此,可以为 C、C++、Python 和 Java 等很多语言提供类和方法列表视图等等,详见 tagbar

推荐使用 Vundle 管理 Vim 插件,这样就可以简单几步安装插件了。

  1. 在 vimrc 文件里添加如下内容:

    Plugin 'majutsushi/tagbar'
    
  2. 执行 :so $MYVIMRC

  3. 执行 :PluginInstall

安装 Exuberant ctags

tagbar 正常工作依赖于 Vim 7.0+ 和 Exuberant ctags。

下载地址:http://ctags.sourceforge.net/

下载后将 ctags 可执行文件放置到一个在 PATH 环境变量的文件夹里,或者 Vim 安装目录的 Vim74 文件夹下,比如我是将 ctags.exe 放在 D:\Program Files (x86)\Vim\vim74 文件夹下。

配置 tagbar 显示 Markdown 导航窗格

tagbar 默认并不支持 Markdown 文件,但配置一下就好了。

  1. 创建 ~/.ctags.d/markdown.ctags 文件(Windows 下是 C:\Users\<username>\.ctags.d\markdown.ctags),将如下内容贴到文件里:

    --langdef=markdown
    --langmap=markdown:.md
    --regex-markdown=/^#{1}[ \t]*([^#]+.*)/. \1/h,headings/
    --regex-markdown=/^#{2}[ \t]*([^#]+.*)/.   \1/h,headings/
    --regex-markdown=/^#{3}[ \t]*([^#]+.*)/.     \1/h,headings/
    --regex-markdown=/^#{4}[ \t]*([^#]+.*)/.       \1/h,headings/
    --regex-markdown=/^#{5}[ \t]*([^#]+.*)/.         \1/h,headings/
    --regex-markdown=/^#{6}[ \t]*([^#]+.*)/.           \1/h,headings/
    

    这表示提取 Markdown 文件里的一到六级标题,并使用空格缩进表示层次。

  2. 给你的 vimrc 文件里增加如下内容:

    let g:tagbar_type_markdown = {
            \ 'ctagstype' : 'markdown',
            \ 'kinds' : [
                    \ 'h:headings',
            \ ],
        \ 'sort' : 0
    \ }
    

    配置 tagbar 支持 Markdown。

更多自定义配置

  1. 现在你可以使用 :TagbarToggle<CR> 来打开导航窗格了,但每次开关导航窗格都要敲这么长一串命令毕竟不够方便,配置快捷键来操作更顺手,在你的 vimrc 文件里增加一个映射:

    nnoremap <leader>tb :TagbarToggle<CR>
    

    现在你可以使用 <leader>tb 来随时开/关导航窗格了。

  2. 导航窗格默认是在右边,如果你也像我一样喜欢它在左边,也想指定它的宽度,可以在你的 vimrc 文件里配置:

    let g:tagbar_width = 30
    let g:tagbar_left = 1
    

至此,大功告成了!

根据我的这个文章没有配置成功的同学,可以参考下我的配置 https://github.com/mzlogin/config-files

参考链接

目录
相关文章
|
6月前
|
JSON 前端开发 JavaScript
Docusaurus框架——快速搭建markdown文档站点介绍sora
Docusaurus框架——快速搭建markdown文档站点介绍sora
179 0
|
6月前
|
前端开发
914.【前端】Taro集成towxml渲染markdown文档
914.【前端】Taro集成towxml渲染markdown文档
393 2
|
21天前
|
开发工具
用 Vim 编辑 Markdown 时直接粘贴图片
介绍一款 Vim 插件,可以帮助提升编辑 Markdown 时的从剪贴板粘贴图片的效率和体验。
30 2
|
2月前
基于typora编写Markdown文档
如何使用Typora编写Markdown文档的教程,包括软件设置、快捷键使用以及一些使用技巧。
65 18
|
4月前
|
JavaScript Java
Java 将Markdown文件转换为Word和PDF文档
【7月更文挑战第5天】Java中使用`Spire.Doc for Java`库可方便地将Markdown转换为Word或PDF。基本步骤包括导入模块,创建`Document`对象,加载Markdown文件,然后保存为目标格式(`.docx`或`.pdf`)。若遇到`Invalid UTF-8 stream`错误,需确保Markdown文件是UTF-8无BOM编码。页面设置可通过`PageSetup`类调整。注意,实际应用会依据具体需求和环境有所调整。
284 6
|
4月前
|
JSON 监控 数据挖掘
上网行为管理软件中的Markdown文档编写与格式化
Markdown是轻量级标记语言,用于快速排版和格式化文本,常见于技术文档和博客。基本语法包括:#(1-6个)创建标题,空行分隔段落,*或-创建列表,[文本](链接)插入链接,![文本](图片URL)插入图片。此外,还有代码块(```包围)、引用(&gt;)等高级格式。Markdown支持HTML嵌入以自定义样式,并广泛应用于上网行为管理等领域的文档编写。通过自动化脚本,能将监控数据提交至网站进行分析。
47 6
|
4月前
|
自然语言处理 开发者 Python
Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的 HTML 内容。Markdown 的语法简洁明了、学习容易,而且功能比纯文本更强。
Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的 HTML 内容。Markdown 的语法简洁明了、学习容易,而且功能比纯文本更强。
|
4月前
|
Unix Linux Shell
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
|
4月前
|
存储 JavaScript Python
word文档转成Markdown文档并在Typora免费版添加图床-----想想都很香
word文档转成Markdown文档并在Typora免费版添加图床-----想想都很香
174 0
|
6月前
|
存储 对象存储 C++
在 VS Code 中使用 OSS 进行 Markdown 文档编写
阿里云OSS对象存储服务是理想的存储解决方案,专门用于承载大量非结构化数据。在VSCode中编写Markdown文档时,手动上传图片至OSS并获取相应链接的过程通常复杂且耗时。为此,Aliyun OSS Uploader插件应运而生,以简化和优化此流程。它不仅能够自动将图片上传到OSS并生成可供插入的链接,还能在您需要时通过撤回链接,删除已上传的图片,极大地提升了效率和便捷性。