目录

• 1、Markdown教程
• 2、生成html
• 3、目录制作
• • 3.1 vscode Markdown Preview Enhanced 插件
  • 3.2 自定义侧边栏
• 4、参考

1、Markdown教程

Markdown 教程 | 菜鸟教程

2、生成html

通过 vscode 下载 Markdown Preview Enhanced、Markdown PDF等插件，就可以实现转化

3、目录制作

当文档内容较多时，就想生成个目录。而是不是顶部固定的目录，是侧边栏固定的目录。

3.1 vscode Markdown Preview Enhanced 插件

这款工具有生成侧边栏的功能，它在生成 html 时，也可以插入自定义 js。（这个功能挺强大的，可以改造成你想要的任何样子）


安装好后，打开 *.md 文件，会在右上角展示个图标，点击图标，可以预览 markdown 样式。（两个相同的图标，左侧是Markdown Preview Enhanced 插件，右侧是 vscode 自带的）

这个插件他有很多功能，这里不描述，只说如何生成侧边栏。

3.2 自定义侧边栏

在 *.md 文件中，插入这句话，

@import "https://haogeshuohuanihaohaoting.github.io/static/mdCreateMenu.js"

右键点击预览页，会出现 HTML -> HTML(offline)选项，点击此选项，可以生成 html
这个html 会引入 https://haogeshuohuanihaohaoting.github.io/static/mdCreateMenu.js
这个 js 就是自定义的生成侧边栏的 js，这个功能较简单，没有折叠、拖拽的功能。（你们可以写个自己喜欢的样式）

4、参考

1、https://zhuanlan.zhihu.com/p/421829363