docsify制作在线说明文档的轻量级神器

在网上发现了一个使用html ,处理加载md文件,极其简单便可以制作出漂亮的在线说明文档————神器docsify。

GIThub地址:https://github.com/QingWei-Li/docsify/

中文文档地址(就是一个demo):https://docsify.js.org/#/zh-cn/

这个是基于vue2.0的,下面记录一下最简单最快速的用法。

1、复制粘贴以下代码到根目录index.html

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta charset="UTF-8">
  <link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
</head>
<body>

<!--nav 可以删除去--> <nav> <a href="#/">EN</a> <a href="#/zh-cn/">中文</a> </nav>

<div data-app id="main">加载中</div>
<script> window.$docsify = { el: '#main', //配置节点 loadSidebar: true, //设置是否加载sidebar subMaxLevel: 2, //设置目录最大层级 coverpage: true, //设置是否要封面 } </script>

<script src="//unpkg.com/docsify/lib/docsify.min.js"></script> </body> </html> </html>

2、在目录里面放上生成好的md文件

根目录里面放上README.MD(相当于index页),_sidebar.md(侧边栏),_coverpage.md(封面,这个如果不要,那么index.html中就要去掉coverpage:true的设置)。

3、1和2中文件放到静态网站,就可以浏览了。

当然这是最简单的方法,docsify还提供有CLI工具,具有强大的功能。

放一个test文档,供大家参考》》》》》链接

原文地址:https://www.cnblogs.com/jsben/p/8434724.html