基于nginx + docsify搭建文档中心
基于nginx + docsify搭建文档中心
一、概述
上一篇文章：基于Openresty搭建本地简易文档中心 介绍了如何使用OpenResty搭建一个简易的文档中心。但是可能太简易了，不够好看， 我们可以用一些开源工具去搭建，比如docsify。
如果大家正在寻找一个java的学习环境，或者在开发中遇到困难，可以加入我们的java学习圈，点击即可加入，共同学习，节约学习时间，减少很多在学习中遇到的难题。
二、配置nginx
我们nginx转发：
location /doc {
alias /static/doc/;
index index.html;
}这样，打开127.0.0.1/doc 就访问了文档中心。
三、docsify使用
3.1 设置首页
下面的代码是使用docsify的index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JpaMapper</title>
<meta name="keywords" content="文档,博客,doc">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="https://lib.baomitu.com/docsify/4.9.4/themes/vue.css">
</head>
<body>
<div id="app"></div>
</body>
<script>
window.$docsify = {
coverpage: true,
loadNavbar: true,
homepage: 'README.md',
auto2top: true
}
</script>
<!-- Docsify -->
<script src="https://lib.baomitu.com/docsify/4.9.4/plugins/search.min.js"></script>
<script src="https://lib.baomitu.com/docsify/4.9.4/docsify.min.js"></script>
<!-- Prism -->
<script src="https://lib.baomitu.com/prism/9000.0.1/components/prism-java.min.js"></script>这里
homepage: 'README.md'设置了markdown文件。- search.min.js是提供搜索使用，可以去掉。docsify.min.js必须保留。vue.css美化样式。
- prism-java.min.js是美化Java代码使用，可以去掉。
coverpage: true是否需要提供一个覆盖页，就是会先显示这个覆盖页，下划后显示README.md。如果设置为true，需要提供一个_coverpage.md文件，内容随意。loadNavbar: true是否提供导航条，如果设置为true，需要提供一个_navbar.md文件，内容随意。
3.2 设置coverpage
coverpage: true设置为true，需要提供一个_coverpage.md文件，内容可以这样写：
<img src="logo.png" width="50" >
# Jpa-Mapper
> 轻量级JPA风格的mybatis通用插件
- 易上手，使用简单，与JPA hibernate风格接近，易于切换
[GitHub](https://github.com/ffch/jpa-mapper/)
[Gitee](http://gitee.com/ffch/JpaMapper)
[Get Started](#《Mybatis通用插件Jpa-Mapper》)大多数开源项目都是这样的。
3.3 设置Navbar
loadNavbar: true设置为true，需要提供一个_navbar.md文件，内容可以这样写：
- <a href="../blog/" >博客首页</a>
- <a href="../index.html" >主页</a>
- <a href="../login.html" >加入我们</a>大多数开源项目都是这样的。
四、展示效果
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2023-01-18 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录