工具:

visual studio code + Markdown Preview Enhanced插件

步骤:

  1. 用vscode打开 xxx.md 并打开MPE的侧边预览
    在这里插入图片描述
  2. 将光标放到第一行,然后按Ctrl+Shift+P(MacOS:command+shift+p)呼出命令面板,输入 Markdown Preview Enhanced: Create Toc 会在光标位置生成一段代码
  3. 在第一行加上 front-matter规则
text
1 2 3 4 5 6 7 8 9 10
 ---
html:
   toc: true
   # number_sections: true
   toc_depth: 6
   toc_float: true
      collapsed: true
      smooth_scroll: true
--- 

(保证 这个Enable Script Execution 开着,在设置里面找)
在这里插入图片描述

  1. 在MPE生成的预览页 右键生成 HTML文件即可

md效果图
在这里插入图片描述
在这里插入图片描述

原文地址:https://blog.csdn.net/weixin_43599827/article/details/122694071?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522168905674116800227431657%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fall.%2522%257D&request_id=168905674116800227431657&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~first_rank_ecpm_v1~rank_v31_ecpm-23-122694071-null-null.142^v88^control_2,239^v2^insert_chatgpt&utm_term=markdown