欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

基于vscode编写markdown导出带书签(目录)的pdf

程序员文章站 2022-07-05 22:40:04
...

目的

有时候我们需要对写完的markdown文件,导出pdf,同时带有书签。这里总结下我的实现

前提

  1. 基于ubuntu20.04(windows 也适用,只是 对应软件改为下载windows版本)
  2. 基于vscode编写和相关的插件

安装

  1. 下载安装vscode
  2. 下载安装markdown插件 Markdown All in One (方便编写)和 Markdown Preview Enhanced (提供导出功能)
    基于vscode编写markdown导出带书签(目录)的pdf
  3. 因为需要导出带有书签的pdf 所以这里我们 使用 Prince(可以将html导出pdf) (注意这里使用的是ubuntu系统)
    下载地址: https://www.princexml.com/download/ (官网有点慢)
    百度网盘链接: https://pan.baidu.com/s/1Fs8cvThdFo1SAXzaNJXSvw 密码: 4ocm

导出步骤

导出pdf(带书签)

  1. 编写如下的 测试的markdown文件
    文件: test.md
    # 1 第一章
    ## 1.1 介绍
    ...
    ### 1.1.1 介绍1.1.1
    ....
    # 2 第二章
    ## 2.1 详细
    ....
    ### 2.1.1 详细2.1.1
    
  2. 如下图,打开 打开 markdown preview enhanced 的预览
    下图中的箭头指向按钮,打开实时预览
    基于vscode编写markdown导出带书签(目录)的pdf
    3.如下图,在右侧预览区 ,鼠标右键,选择 pdf(Prince),会在当前 markdown 文件目录生成带有书签的pdf
    基于vscode编写markdown导出带书签(目录)的pdf
  3. 成功生成pdf如下图
    基于vscode编写markdown导出带书签(目录)的pdf

书签(目录)在正文最前面

  1. 编写测试文件内容 还是test.md
  2. 在最前面 插入目录
    如下图,光标放在在正文最前面(图中标1的位置),然后输入shift+ctrl+p,搜索 toc,选择 图中标出2的选项(markdown preview enhanced: create toc),然后 ctrl+s保存文件
    基于vscode编写markdown导出带书签(目录)的pdf
  3. 导出pdf或者html
    如下图正文最前方为自动生成的目录,右侧箭头 可以选择导出html或者 pdf(这里导出pdf 选择 chrome pdf 导出才会生成可以跳转的链接)基于vscode编写markdown导出带书签(目录)的pdf
  4. 生成的pdf如下图
    基于vscode编写markdown导出带书签(目录)的pdf