1. 程式人生 > >基於滴滴雲搭建輕量文件網站生成工具 Docsify

基於滴滴雲搭建輕量文件網站生成工具 Docsify

Docsify 是一個動態生成文件網站的工具。不同於 GitBook、Hexo 的地方是它不會將 .md 轉成 .html 檔案,所有轉換工作都是在執行時進行。

這非常實用,如果只是需要快速的搭建一個小型的文件網站,或者不想因為生成的一堆 .html 檔案“汙染” commit 記錄,只需要建立一個 index.html 就可以開始寫文件,可以直接部署在 GitHub Pages,也可以部署在雲上。

本文將介紹如何在滴滴雲上部署 Docsify 。

一、前置條件

在安裝 Docsify 之前,需要先購買一臺 DC2 雲伺服器,並安裝 Node 環境。如果已經安裝成功,可直接跳至安裝 Docsify 部分。

1.1 購買雲伺服器

首先我們需要有一臺雲伺服器來部署服務,可在滴滴雲上進行購買。具體的購買步驟可參考幫助文件

下面我們看到的是已經購買好的雲伺服器。配置為 2 核 4G, 系統為 CentOS7.6

在這裡插入圖片描述

購買完畢後,遠端登入伺服器,進行服務安裝的安裝與部署。以 dc2-user 的身份登入後,可以通過 sudo su 來切換至管理員身份進行安裝。

1.2 安裝 Node

我們將 Node 服務安裝在 /usr/local 目錄下:

## 下載node
cd /usr/local/src
wget https://nodejs.org/dist/v8.9.0/node-v8.9.0-linux-x64.tar.xz
## 解壓
tar xf node-v8.9.0-linux-x64.tar.xz cd /usr/local ## 重新命名 mv src/node-v8.9.0-linux-x64 node ## 將node新增至path vi ~/.bashrc export NODE_HOME=/usr/local/node export PATH=$NODE_HOME/bin:$PATH source ~/.bashrc ## 安裝成功 node -v // 安裝成功會顯示Node版本

二、安裝 Docsify

2.1 安裝 Docsify

npm i docsify-cli -g

2.2 初始化文件目錄

docsify init ./docs // 會在當前目錄下建立docs目錄,裡面的內容將會作為文件內容展示

可以看到,文件目錄下有這兩個檔案:

[[email protected] docs]# ls 
index.html  README.md

其中 index.html 是入口檔案,README.md 會做為主頁內容渲染。

2.3 預覽

執行一個本地伺服器通過 Docsify Serve 可以方便的預覽效果,而且提供 LiveReload 功能,可以讓實時的預覽。預設訪問 http://ip:3000

docsify serve docs

在這裡插入圖片描述

文件內容豐富之後,可達到官網類似效果。

在這裡插入圖片描述

三、使用 Nginx 代理

實際工作中,我們很多服務都是配在 Nginx 裡,方便使用 Nginx 的負載均衡、許可權控制等功能。

3.1 Nginx 安裝

可參考 CentOS7 安裝 Nginx 的兩種方式 這篇文件在滴滴雲上安裝 Nginx。

3.2 Nginx 配置

下面是一個 Nginx 配置的示例,注意自己的 server name 需要進行替換:

server {
      listen 80;
      server_name your_server_name; ## 這裡需要寫自己的伺服器名稱

      root /usr/libra/docs; ## docsify建立的目錄
      set $node_port 3000;

      index index.js index.html index.htm;


      location / {
        proxy_http_version 1.1;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_pass http://127.0.0.1:$node_port$request_uri;
        proxy_redirect off;
      }
    }

配置完成後,我們就可以通過 80 埠訪問文件服務了。

文件系統有很多,GitBook 也是非常好的文件工具,可參考 在滴滴雲 DC2 上基於 Gitbook+Nginx 構建輕量級文件管理服務 這篇文件搭建 GitBook 服務。