摘要:你可以指定导航栏文件名的内容可以是这样中文当然也支持二级列表,将生成一个下拉列表中文为什么是而不用想要实现的是用最简单的方式动态渲染内容。
docsify
无需构建快速生成文档页
网站:https://github.com/qingwei-li...
文档:https://docsify.js.org/zh-cn
无需构建,写完 markdown 直接发布
支持自定义主题
容易使用并且轻量
快速上手 创建项目新建一个空项目,接着创建一个 docs 目录并进入到 docs 目录下
mkdir my-project && cd my-project mkdir docs && cd docs创建入口文件
创建一个 404.html 文件,内容为
新建 README.md 文件,作为主页面
# Title ## balabala部署!
将项目 push 到 GitHub 仓库后到设置页面开启 GitHub Pages 功能,选择 docs/ 选项
方便快速创建文档目录,会读取项目的 package.json 里的选项作为 docsify 的配置,支持本地预览。
安装npm i docsify-cli -g初始化文档
默认初始化在当前目录,推荐将文档放在 docs 目录下
docsify init docs启动本地服务
启动一个 server 方便预览,打开 http://localhost:3000
docsify serve docs
更多选项参考 docsify-cli
主题目前提供 vue.css 和 buble.css,直接修改 404.html 里的 cdn 地址即可
压缩版
更多功能 多页面
README.md 作为主页面,如果需要其他页面,直接在文档目录下创建对应的 *.md 文件,例如创建一个 guide.md 那么对应的路由就是 /guide。
导航导航需要自己写在 404.html 文件里,效果参考本文档
配置参数 repo参考本文档的右上角的 GitHub 图标,如果要开启的话,将 404.html 里的 script 改成
max-level目录最大展开层级,默认值为 6
el替换节点元素,默认为 #app
sidebar-toggleSidebar 开关按钮
sidebar设置后 TOC 功能将不可用,适合导航较多的文档,data-sidebar 传入全局变量名。
load-sidebar
读取侧边栏配置文件,如果配置,默认加载当前目录下的 _sidebar.md。如果文件不存在,会显示 TOC 作为侧边栏内容。如果你有二级目录,也应该放置一份配置文件。
你可以指定侧边栏文件名
_sidebar.md 的内容可以是这样的
- [Home](/) - [Installation](/installation) - Essentials - [Getting Started](/getting-started) - [Dynamic Route Matching](/dynamic-matching) - [Nested Routes](/nested-routes) - [Programmatic Navigation](/navigation) - [Named Routes](/named-routes) - [Named Views](/named-views) - [Redirect and Alias](/redirect-and-alias) - [HTML5 History Mode](/history-mode)load-navbar
读取导航配置文件,如果配置,默认加载当前目录下的 _navbar.md。如果文件不存在,会显示 html 里定义的导航栏。
你可以指定导航栏文件名
_navbar.md 的内容可以是这样
- [en](/) - [中文](/zh-cn)
当然也支持二级列表,将生成一个下拉列表
- [download](/download) - language - [en](/) - [中文](/zh-cn)FAQ 为什么是 404.html 而不用 index.html
docsify 想要实现的是用最简单的方式 动态渲染内容。
例如我有两个文档分别为 README.md 和 guide.md,如果我用 index.html 作为文件名,README.md 可以被正确的渲染因为我们已经规定它为首页文件,但是如果我们访问 my-domain.com/guide 想要得到的结果是 guide.md 的内容,它将无法工作,因为目录下并不存在一个 guide.html 的文件。
但是 GitHub Pages 服务器找不到资源, 就会回退并渲染 404.html 文件。?
网站:https://github.com/qingwei-li...
文档:https://docsify.js.org/zh-cn
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/54387.html
摘要:你可以指定导航栏文件名的内容可以是这样中文当然也支持二级列表,将生成一个下拉列表中文为什么是而不用想要实现的是用最简单的方式动态渲染内容。 showImg(https://segmentfault.com/img/bVGh1i?w=2562&h=1972); docsify 无需构建快速生成文档页 网站:https://github.com/qingwei-li...文档:https:...
摘要:介绍是一个动态生成文档网站的工具。不同于的地方是它不会生成将转成文件,所有转换工作都是在运行时进行。使用来开发工具,可以方便创建及本地预览文档网站。 1. docsify介绍 docsify 是一个动态生成文档网站的工具。不同于 GitBook、Hexo 的地方是它不会生成将 .md 转成 .html 文件,所有转换工作都是在运行时进行。 这将非常实用,如果只是需要快速的搭建一个小型的...
摘要:前端切图神器前端掘金安装前端的基础工作就是把设计师的设计稿还原成前端页面,所以切图是作为一个前端的基本技能。 腾讯 Web 工程师的前端书单 - 阅读 - 掘金作者:link 2014年一月以来,自己接触web前端开发已经两年多了,记录一下自己前端学习路上看过的,以及道听途说的一些书,基本上按照由浅入深来介绍。 JavaScript 入门 《JavaScript权威指南(第六版)》 ★...
摘要:说明是一个基于和开发的评论插件。默认值类型布尔值,选填,类似评论框的全屏遮罩效果。默认值类型布尔值,选填,如果当前页面没有相应的且登录的用户属于,则会自动创建。参考类型布尔值,选填,启用快捷键提交评论。 1. 说明 Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。 Gitalk 的特性: 1、使用 GitHub 登录2、支持多语言 [en, zh-...
阅读 2454·2023-04-25 19:24
阅读 1647·2021-11-11 16:54
阅读 2779·2021-11-08 13:19
阅读 3522·2021-10-25 09:45
阅读 2520·2021-09-13 10:24
阅读 3216·2021-09-07 10:15
阅读 3875·2021-09-07 10:14
阅读 2916·2019-08-30 15:56