zoukankan      html  css  js  c++  java
  • 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文档,供大家参考》》》》》链接

  • 相关阅读:
    viewport
    Flex 布局教程
    鼠标放上去盒子向上滑动
    鼠标放图片上,原图上划上去一个透明图片
    类加载过程
    JVM入门
    redis简介和安装
    JMH和Disruport
    线程池
    JUC
  • 原文地址:https://www.cnblogs.com/jsben/p/8434724.html
Copyright © 2011-2022 走看看