科学工具让世界更美好
让世界更美好
文档站点生成器 Docsify 使用指南Docsify 是一个文档站点生成工具，能直接将 Markdown 文件转换为网站，轻量灵活。
Docsify无静态 HTML 生成，能直接读取 Markdown 文件渲染，更新内容更方便。体积小，加载速度快，适合快速搭建技术文档。智能全文搜索集成搜索插件，方便用户查找内容，可自定义界面风格，适配不同场景需求，支持扩展功能，如添加封面页、导航栏等。
通过 npm 全局安装 docsify-cli，命令如下：
npm i docsify-cli -g
在指定目录（如 ./docs）初始化文档结构：
docsify init ./docs
初始化后，目录下会生成：
• index.html：入口文件，定义页面结构。
• README.md：作为首页内容，可直接编辑修改。
• .nojekyll：防止 GitHub Pages 忽略以下划线开头的文件。
启动本地服务查看效果：
docsify serve docs
浏览器访问 http://localhost:3000 即可查看生成的文档站点。
若不使用 npm，可手动创建 index.html，引入 docsify 核心文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify@4/themes/vue.css">
</head>
<body>
<div id="app"></div>
<script>window.$docsify = { /* 配置项 */ }</script>
<script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
</body>
</html>
通过在 index.html 中定义 window.$docsify 对象，可配置 docsify 的各项功能：
repo：设置 GitHub 仓库地址，页面右上角会显示仓库图标。
window.$docsify = { repo: 'docsifyjs/docsify' }
maxLevel：设置目录最大层级，默认 6 级，可调整为 maxLevel: 3 等。
coverpage：启用封面页，可指定文件名或多语言封面路径。
alias：设置路由别名，支持正则匹配，如：
window.$docsify = {
alias: {
'/foo/(.*)': '/bar/$1',
'/changelog': 'https://raw.githubusercontent.com/docsifyjs/docsify/master/CHANGELOG'
}
}
loadSidebar：加载侧边栏配置，可指定 _sidebar.md 或自定义文件。
relativePath：启用相对路径链接，方便多语言或子目录结构管理。
name：设置网站名称，支持 HTML 自定义样式：
window.$docsify = { name: '<span style="color: #3F51B5">docsify</span>' }
themeColor：自定义主题色，如 themeColor: '#3F51B5'。
topMargin：滚动时顶部留白，适配固定标题栏场景，如 topMargin: 90。
routes：定义动态路由，可返回字符串或函数生成 Markdown 内容：
window.$docsify = {
routes: {
'/foo': '# 自定义内容',
'/bar/(.*)': (route, matched) => `# 匹配路径: ${matched[1]}`
}
}
vueComponents：集成 Vue 组件，扩展交互功能：
window.$docsify = {
vueComponents: {
'button-counter': {
template: '<button @click="count++">点击 {{ count }} 次</button>',
data() { return { count: 0 } }
}
}
}
Docsify通过简单的配置和 Markdown 语法，就能快速生成美观实用的站点，从快速初始化到自定义路由、集成 Vue 组件，是开发者构建文档系统一个非常优秀的工具。
