Github+docsify打造个人文档

原文地址: Github+docsify打造个人文档

1. 简介

在日常开发中 前后端对接时 经常要写很多文档Api。docsify就是一个强大的文档生成工具 界面清新好 支持语法高亮和Markdown 语法,并且docsify 扩展了一些 Markdown 语法可以让文档更易读。像vue.js官网(cn.vuejs.org/)就是 docsify 其中的一种主题 并且是目前用的的最多的主题

2. 效果图如下

预览链接:http://gaohanghang.github.io/docsify/

3. 快速开始

首先先安装好npm和nodejs,这里就不做过多介绍了 自行安装即可

安装docsify 推荐安装 docsify-cli 工具,可以方便创建及本地预览文档网站。

1
npm i docsify-cli -g

初始化项目

1
2
# 进入指定文件目录 如下:F:\ideWork\githubWork\test_docs 
运行 docsify init ./docs

初始化成功后,可以看到 ./docs 目录下创建的几个文件

1
2
3
index.html 入口文件
README.md 会做为主页内容渲染
.nojekyll 用于阻止 GitHub Pages 会忽略掉下划线开头的文件

4. 本地预览网站

运行一个本地服务器通过 docsify serve 可以方便的预览效果,而且提供 LiveReload 功能,可以让实时的预览。默认访问 http://localhost:3000

1
docsify serve docs

一个基本的文档网站就搭建好了,docsify还可以自定义导航栏,自定义侧边栏以及背景图和一些开发插件等等 更多配置请参考官方文档 https://docsify.js.org/#/zh-cn/quickstart

5. 下面介绍docsify如何部署到Github Pages

和 GitBook 生成的文档一样,我们可以直接把文档网站部署到 GitHub Pages 或者 VPS 上

5.1 GitHub Pages

GitHub Pages 支持从三个地方读取文件

  • docs/ 目录
  • master 分支
  • gh-pages 分支

上传文件至Github仓库 官方推荐直接将文档放在 docs/ 目录下,在设置页面开启 GitHub Pages 功能并选择 master branch /docs folder 选项。

选择了之后就可以访问个人文档了。

官方文档:https://docsify.js.org/#/zh-cn/quickstart

预览链接:http://gaohanghang.github.io/docsify/

打赏
  • 版权声明: 本博客所有文章除特别声明外,著作权归作者所有。转载请注明出处!
  • Copyrights © 2015-2023 高行行
  • 访问人数: | 浏览次数:

请我喝杯咖啡吧~

支付宝
微信