docsify搭建与使用


官方文档

https://docsify.js.org/#/quickstart

快速开始

首先需要安装nodejs环境,可参考:
全局安装:

npm i docsify-cli -g

(注:如果提示找不到docsify命令,在nodejs的bin目录找到docsify,将之变为全局命令,我的运行一下ln -s /root/node-v14.16.1-linux-x64/bin/docsify /usr/local/bin就好了)
初始化:

docsify init ./docs

(注:也可直接运行docsify init docs,会在当前目录自动创建docs目录并初始化,docs中会生成两个文件index.htmlREADME.md.nojekyll
预览网站,访问3000端口:

docsify serve docs

也可以手动预览网站(学渗透测试的同学可能对这一手很熟悉):

cd docs && python -m SimpleHTTPServer 3000
cd docs && python -m http.server 3000

效果如下:

进阶使用

添加侧边栏

新建_sidebar文件,里面添加:

- [CentOS](centos.md)
- [Docker](docker.md)
- [Mac](mac.md)
- [NPM](npm.md)
- [推荐](recommend.md)

index.html添加:



侧边栏二级目录

index.html中添加:



侧边栏会根据md文件中的标题自动生成二级目录,如果需要展示3级或者4级目录,修改subMaxLevel: 2中的数字到对应级别即可。

主题风格

官方提供了四款:





(注:个人觉得dark.css还不错)
更多自定义请参考官网。

全局搜索

直接添加js,更多自定义请查看官方文档,直接添加js是属于开袋即食的做法:


Copy to Clipboard


效果如下:

Pagination

文章底部展示上一篇和下一篇文章的链接,直接使用js即可,如果想自定义可以参考官网的配置方法


我这里偷懒了,直接引用的js,效果如下:

配合typora使用

写md时肯定会遇到图片文件放哪的问题,以下给出一种方案:
typora设置如下:

在md文件中写好后,将整个images目录和md文件放到docs目录。

参考&&致谢

部分参考: