Markdown无论在编程还是平时其他工作学习中都扮演着重要的角色,如:开发文档、产品说明,甚至是流程图......

但是有的时候需要我们以网页形式展示给他人阅读,当遇到这种场景时候我们需要从两个方面考虑该问题:1.是不是可以直接找个框架直接在线吧md文档转一下?2.是不是工具直接把md转成html文件,然后发布出去?相比较之下我选择了后者。

废话不多说上干货需要原料:git、node(此处不做赘述,自行百度安装)

需要一个开源库:i5ting_toc(https://github.com/i5ting/tocmd.npm

步骤1:找个文件夹:如a文件夹,安装i5ting_toc,



npm install -g i5ting_toc





Markdown转成带目录的Html(i5ting_toc)_开发文档

步骤2:把你的md文件拷至a文件夹下,如:b.md;



Markdown转成带目录的Html(i5ting_toc)_分割线_02

步骤3:cmd命令进入该文件下:



i5ting_toc -f b.md is for sale! -o



npm 从5.2版开始,增加了 npx 命令,当执行上面语句不能用时候,可以使用



npx i5ting_toc -f b.md is for sale! -o



到此已经生成



Markdown转成带目录的Html(i5ting_toc)_开发文档_03

preview文件夹下



Markdown转成带目录的Html(i5ting_toc)_开发文档_04

-------------------------分割线-:下面是一些小拓展--------------------

1.生成到不同文件夹下面

找到i5ting_toc安装路径,node_modules



Markdown转成带目录的Html(i5ting_toc)_分割线_05

打开



Markdown转成带目录的Html(i5ting_toc)_分割线_06

62行改一下你想要的的文件夹名称



Markdown转成带目录的Html(i5ting_toc)_开发文档_07

改为



Markdown转成带目录的Html(i5ting_toc)_分割线_08

再打开



Markdown转成带目录的Html(i5ting_toc)_分割线_09



Markdown转成带目录的Html(i5ting_toc)_github_10

改为



Markdown转成带目录的Html(i5ting_toc)_分割线_11

cmd执行



i5ting_toc -f sample.md -o



或者



npx i5ting_toc -f sample.md -o





Markdown转成带目录的Html(i5ting_toc)_github_12



Markdown转成带目录的Html(i5ting_toc)_github_13



Markdown转成带目录的Html(i5ting_toc)_分割线_14

代码没有高亮怎么办,下一章我会讲讲怎样修改