搭建读书笔记网站基于docsfty

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

搭建环境

准备环境：服务器（云服务器），nginx

1. 克隆我的仓库https://gitee.com/dong-admin/docs.git
2. 购买一台云服务器（推荐阿里云或者腾讯云）
3. nginx配置（博主采用的是腾讯云提供的https的证书）：

#user  root;
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;
                #SSL 访问端口号为 443
                listen 443 ssl;
                #填写绑定证书的域名
                #server_name cloud.tencent.com; 
                #证书文件名称
                ssl_certificate xxxxxx_bundle.crt;
                #私钥文件名称
                ssl_certificate_key xxxxxx.key;
                ssl_session_timeout 5m;
                #请按照以下协议配置
                ssl_protocols TLSv1.2 TLSv1.3;
                #请按照以下套件配置，配置加密套件，写法遵循 openssl 标准。
                ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
                ssl_prefer_server_ciphers on;
                #charset koi8-r;

                #access_log  logs/host.access.log  main;
                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;
                #把http的域名请求转成https
                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="https://cdn.jsdelivr.net/npm/docsify-pagination/dist/docsify-pagination.min.js"></script>

docsify配置

window.$docsify = {
            // 项目名称
            name: 'notes',
            // 仓库地址，点击右上角的Github章鱼猫头像会跳转到此地址
            repo: 'https://github.com/dkhsix?tab=repositories',
            // 侧边栏支持，默认加载的是项目根目录下的_sidebar.md文件
            loadSidebar: true,
            // 导航栏支持，默认加载的是项目根目录下的_navbar.md文件
            loadNavbar: true,
            // 封面支持，默认加载的是项目根目录下的_coverpage.md文件
            coverpage: true,
            // 最大支持渲染的标题层级
            maxLevel: 5,
            // 自定义侧边栏后默认不会再生成目录，设置生成目录的最大层级（建议配置为2-4）
            subMaxLevel: 4,
            // 小屏设备下合并导航栏到侧边栏
            mergeNavbar: true,
            // 历史路由配置，本地调式需要注释，服务器运行则取消注释，目的是取出路由中的#
            // routerMode:'history',
            // 回到顶部
            scrollToTop: {
                auto: true,
                text: 'top',
                right: 30,
                bottom: 30,
                // 偏移量，触发按钮
                offset: 500,
            },
            auto2top: true,
            // 翻页
            pagination: {
                    previousText: '上一章节',
                    nextText: '下一章节',
            }
        }

全局搜索配置

 			search: {
                maxAge: 86400000,// 过期时间，单位毫秒，默认一天
                paths: auto,// 注意：仅适用于 paths: 'auto' 模式
                placeholder: '搜索',
                // 支持本地化
                placeholder: {
                    '/zh-cn/': '搜索',
                    '/': 'Type to search'
                },
                noData: '找不到结果',
                depth: 4,
                hideOtherSidebarContent: false,
                namespace: 'Docsify-dkh',
               
            }

启动

首先保证你的电脑上已经安装node和npm环境，有条件的可以安装个淘宝的cnpm

安装docsify客户端

npm i docsify-cli -g

启动项目

docsify serve 文件夹名字

至此搭建完毕，有问题欢迎指正