本文采用docsfty搭建自己的图书笔记网站(内容包括java、大数据、中间件等) 先放自己搭建的网站:dlw1314.top 源码地址:https://gitee.com/dong-admin/docs.git 


搭建环境
准备环境:服务器(云服务器),nginx
- 克隆我的仓库https://gitee.com/dong-admin/docs.git
- 购买一台云服务器(推荐阿里云或者腾讯云)
- nginx配置(博主采用的是腾讯云提供的https的证书):
worker_processes 4;
worker_rlimit_nofile 100000;
events {
worker_connections 10240;
use epoll;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
server_name xxxxxxx;
listen 443 ssl;
ssl_certificate xxxxxx_bundle.crt;
ssl_certificate_key xxxxxx.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
location / {
root /usr/local/nginx/dong-docs/;
index index.html index.htm;
}
location @router {
rewrite ^.*$ /index.html last;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
server {
listen 80;
server_name xxxxx;
return 301 https://$host$request_uri;
}
}
导航配置
需要注意的是myDocs目录内的文件下都需要配置 _navbar.md _sidebar.md README.md
_coverpage.md:首页配置
_navbar.md:顶部导航栏配置
_sidebar.md:侧边栏目录
myDocs:md笔记
页面配置
滚动条美化
<style>
::-webkit-scrollbar {
width: 6px;
height: 6px;
background-color: #f5f5f5;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(128, 128, 128, 0.7);
border-radius: 10px;
background-color: #f5f5f5;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(128, 128, 128, 0.7);
background-color: rgb(149, 147, 147);
}
</style>
主题样式配置(可选项【vue.css dark.css buble.css dolphin.css pure.css】)
<link rel="stylesheet"href="https://unpkg.com/docsify/lib/themes/vue.css">
功能js引入
//docsify
<script src="https://unpkg.com/docsify/lib/docsify.min.js"></script>
//表情
<script src="https://unpkg.com/docsify@4.12.2/lib/plugins/emoji.min.js"></script>
// 图片放大缩小支持
<script src="https://unpkg.com/docsify/lib/plugins/zoom-image.min.js"></script>
// 全局搜索
<script src="https://unpkg.com/docsify/lib/plugins/search.min.js"></script>
// md文档代码可复制
<script src="https://unpkg.com/docsify-copy-code@2.1.1/dist/docsify-copy-code.min.js"></script>
// 回到顶部
<script src="https://unpkg.com/docsify-scroll-to-top/dist/docsify-scroll-to-top.min.js"></script>
// 翻页
<script src="//cdn.jsdelivr.net/npm/docsify-pagination/dist/docsify-pagination.min.js"></script>
docsify配置
window.$docsify = {
name: 'notes',
repo: 'https://github.com/dkhsix?tab=repositories',
loadSidebar: true,
loadNavbar: true,
coverpage: true,
maxLevel: 5,
subMaxLevel: 4,
mergeNavbar: true,
scrollToTop: {
auto: true,
text: 'top',
right: 30,
bottom: 30,
offset: 500,
},
auto2top: true,
pagination: {
previousText: '上一章节',
nextText: '下一章节',
}
}
全局搜索配置
search: {
maxAge: 86400000,
paths: auto,
placeholder: '搜索',
placeholder: {
'/zh-cn/': '搜索',
'/': 'Type to search'
},
noData: '找不到结果',
depth: 4,
hideOtherSidebarContent: false,
namespace: 'Docsify-dkh',
}
至此搭建完毕,有问题欢迎指正
|