docsify - 生成文档网站简单使用教程

CompileYouth 发布于2019-08-23 14:24 / 2943人阅读

摘要：介绍是一个动态生成文档网站的工具。不同于的地方是它不会生成将转成文件，所有转换工作都是在运行时进行。使用来开发工具，可以方便创建及本地预览文档网站。

1. docsify介绍

docsify 是一个动态生成文档网站的工具。不同于 GitBook、Hexo 的地方是它不会生成将 .md 转成 .html 文件，所有转换工作都是在运行时进行。

这将非常实用，如果只是需要快速的搭建一个小型的文档网站，或者不想因为生成的一堆 .html 文件“污染” commit 记录，只需要创建一个 index.html 就可以开始写文档而且直接部署在 GitHub Pages。

2. 引入docsify方式 2.1 手动创建index.html并引入docsify文件

docsify使用方式很简单，只需要在项目中创建一个index.html文件，内容能够如下：

然后在项目中创建一个README.md文件：

## 我是首页

这是我的首页介绍

如果你的系统安装了Python 的话，可以使用Python来启动一个服务：

python -m SimpleHTTPServer 3000

Serving HTTP on 0.0.0.0 port 3000 ...
127.0.0.1 - - [03/Jan/2019 13:45:27] "GET / HTTP/1.1" 200 -

然后在浏览器中输入http://localhost:3000/查看浏览效果。

如果没有Python，还是可以使用http-server启动服务，
可在终端输入npm install http-server -g来安装http-server。

http-server 

Starting up http-server, serving ./
Available on:
  http://127.0.0.1:8080
  http://172.24.70.142:8080
Hit CTRL-C to stop the server

然后在浏览器中输入http://127.0.0.1:8080查看浏览效果。

注意：
1.在此模式下编辑文件保存后，需要手动刷新浏览器才能看见修改的效果，下面介绍的docsify-cli可实现自动查看效果。
2.强烈建议把index.htm文件中的docsify.min.js和vue.css文件复制到本地项目，然后使用如下方式引入：

这样做的好处是不在依赖网络环境了。

2.2 使用docsify-cli来开发

docsify-cli 工具，可以方便创建及本地预览文档网站。

2.2.1 安装

docsify需要本地先安装node, 如果没有安装node，可在node官网选择对应操作系统下载安装：https://nodejs.org/zh-cn/

终端输入npm i docsify-cli -g进行全局安装：

npm i docsify-cli -g

/usr/local/bin/docsify -> /usr/local/lib/node_modules/docsify-cli/bin/docsify
> fsevents@1.2.4 install /usr/local/lib/node_modules/docsify-cli/node_modules/fsevents
> node install
[fsevents] Success: "/usr/local/lib/node_modules/docsify-cli/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile
> docsify@4.8.6 postinstall /usr/local/lib/node_modules/docsify-cli/node_modules/docsify
> opencollective postinstall

                         Thanks for installing docsify

GPU云服务器云服务器文档生成 python生成文档 python文档生成生成API文档

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/100563.html

docsify - 无需构建快速生成文档网站

摘要：你可以指定导航栏文件名的内容可以是这样中文当然也支持二级列表，将生成一个下拉列表中文为什么是而不用想要实现的是用最简单的方式动态渲染内容。 showImg(https://segmentfault.com/img/bVGh1i?w=2562&h=1972); docsify 无需构建快速生成文档页网站：https://github.com/qingwei-li...文档：https:...

xiaokai 2019-08-02 15:56 评论0 收藏0
docsify - 无需构建快速生成文档网站

摘要：你可以指定导航栏文件名的内容可以是这样中文当然也支持二级列表，将生成一个下拉列表中文为什么是而不用想要实现的是用最简单的方式动态渲染内容。 showImg(https://segmentfault.com/img/bVGh1i?w=2562&h=1972); docsify 无需构建快速生成文档页网站：https://github.com/qingwei-li...文档：https:...

longmon 2019-08-22 10:44 评论0 收藏0
Gitalk评论插件使用教程

摘要：说明是一个基于和开发的评论插件。默认值类型布尔值，选填，类似评论框的全屏遮罩效果。默认值类型布尔值，选填，如果当前页面没有相应的且登录的用户属于，则会自动创建。参考类型布尔值，选填，启用快捷键提交评论。 1. 说明 Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。 Gitalk 的特性： 1、使用 GitHub 登录2、支持多语言 [en, zh-...

孙吉亮 2019-08-23 15:04 评论0 收藏0
技术甜品店 - 收藏集 - 掘金

摘要：前端切图神器前端掘金安装前端的基础工作就是把设计师的设计稿还原成前端页面，所以切图是作为一个前端的基本技能。腾讯 Web 工程师的前端书单 - 阅读 - 掘金作者：link 2014年一月以来，自己接触web前端开发已经两年多了，记录一下自己前端学习路上看过的，以及道听途说的一些书，基本上按照由浅入深来介绍。 JavaScript 入门《JavaScript权威指南（第六版）》 ★...

Gilbertat 2019-08-20 16:40 评论0 收藏0