网站首页 > 教程文章 正文
Docsify是什么
docsify 是一个动态生成文档网站的工具,可以将.md 文件以 wiki 的形式展示给读者,可以用于制作技术文档、用户手册、wiki 等。可以部署于主机、VPS、Github、静态云存储(例如阿里云 OSS)。
官网:https://docsify.js.org/#/
docsify 是一个动态生成文档网站的工具。不同于 GitBook、Hexo 的地方是它不会生成将 .md 转成 .html 文件,所有转换工作都是在运行时进行。
这将非常实用,如果只是需要快速的搭建一个小型的文档网站,或者不想因为生成的一堆 .html 文件“污染” commit 记录,只需要创建一个 index.html
特性
- 无需构建,写完文档直接发布
- 容易使用并且轻量 (压缩后 ~21kB)
- 智能的全文搜索
- 提供多套主题
- 丰富的 API
- 支持 Emoji
- 兼容 IE11
- 支持服务端渲染 SSR (示例)
Docsify安装及使用
node安装
下载地址:https://nodejs.org/dist/v8.9.4/node-v8.9.4-x64.msi
下载完成后点击安装。
查看node 版本,命令:node -v
版本:v8.9.4
docsify安装
npm i docsify-cli -g
docsify init ./docs
生成目录如下:
-| docs/
-| .nojekyll 用于阻止 GitHub Pages 会忽略掉下划线开头的文件
-| index.html 入口文件
-| README.md 会做为主页内容渲染
docsify 启动
本地启动
docsify serve docs
Docsify高级特性
docsify的配置
window.$docsify = {
name: '研发中心',
repo: 'https://git.git',
loadNavbar: true,
loadSidebar: true, // 加载自定义侧边栏
maxLevel: 2, // 默认情况下会抓取文档中所有标题渲染成目录,可配置最大支持渲染的标题层级。
subMaxLevel: 4, // 生成目录的最大层级
mergeNavbar: true, // 小屏设备下合并导航栏到侧边栏
alias: { // 定义路由别名,可以更自由的定义路由规则。 支持正则
'/.*/_sidebar.md': '/_sidebar.md',//防止意外回退
'/.*/_navbar.md': '/_navbar.md'
}
}
动态生成目录
获取代码
执行自动生成命令
会增加_siderbar.md
执行后
运行效果
获取代码
欢迎关注,回复“docsify”,获取免费获取源码下载地址;
猜你喜欢
- 2025-06-03 Elasticsearch数据迁移方案(elasticsearch索引迁移)
- 2025-06-03 Vue、Nuxt服务端渲染、NodeJS全栈项目
- 2025-06-03 Android Studio下载Gradle超时解决方案
- 2025-06-03 一文讲清楚 Markdown+Typora+Pandoc+图床+PicGo
- 2025-06-03 用户说 | 手把手体验通义灵码 2.0 AI 程序员如何让我进阶“架构师”?
- 2025-06-03 15.7k star,经典与效率兼备的后台管理框架
- 2025-06-03 Cursor + 12306 MCP,打造AI智能选票系统,超酷的!
- 2025-06-03 别再自建仓库了,云效Maven仓库不限容量免费用
- 2025-06-03 大模型服务平台百炼使用(百炼大模型训练控制台)
- 2025-06-03 如何实现并部署自己的npm解析服务
- 最近发表
-
- 【Python】一文学会使用 Pandas 库
- Docsify-3分钟搭建属于自己的技术文档WIKI
- Elasticsearch数据迁移方案(elasticsearch索引迁移)
- Vue、Nuxt服务端渲染、NodeJS全栈项目
- Android Studio下载Gradle超时解决方案
- 一文讲清楚 Markdown+Typora+Pandoc+图床+PicGo
- 用户说 | 手把手体验通义灵码 2.0 AI 程序员如何让我进阶“架构师”?
- 15.7k star,经典与效率兼备的后台管理框架
- Cursor + 12306 MCP,打造AI智能选票系统,超酷的!
- 别再自建仓库了,云效Maven仓库不限容量免费用
- 标签列表
-
- location.href (44)
- document.ready (36)
- git checkout -b (34)
- 跃点数 (35)
- 阿里云镜像地址 (33)
- qt qmessagebox (36)
- mybatis plus page (35)
- vue @scroll (38)
- 堆栈区别 (33)
- 什么是容器 (33)
- sha1 md5 (33)
- navicat导出数据 (34)
- 阿里云acp考试 (33)
- 阿里云 nacos (34)
- redhat官网下载镜像 (36)
- srs服务器 (33)
- pico开发者 (33)
- https的端口号 (34)
- vscode更改主题 (35)
- 阿里云资源池 (34)
- os.path.join (33)
- redis aof rdb 区别 (33)
- 302跳转 (33)
- http method (35)
- js array splice (33)