Docker最全教程之使用Node.js搭建團隊技術文檔站（二十三）

本文轉載自查看原文 2019-06-05 10:11 1249 Docker/ Docker最全教程/ dockerfile/ 搭建團隊技術文檔站/ Node.js/ 從理論到實戰/ 教程

前言

各種編程語言均有其優勢和生態，有興趣的朋友完全可以涉獵多門語言。在平常的工作之中，也可以嘗試選擇相對適合的編程語言來完成相關的工作。

在團隊技術文檔站搭建這塊，筆者嘗試了許多框架，最終還是選擇了Hexo，主要是由於其豐富的主題和插件，並且靈活和高度可定制化，改起來也非常方便。我們團隊文檔站即使用Hexo來構建，並且基於容器配置了完整的代碼流水線：docs.xin-lai.com

如果對站點配置、主題、插件存在疑問，可以加群溝通。

Node.js 是一個基於 Chrome V8 引擎構建的JavaScript運行環境，是一個讓JavaScript能夠運行在服務端的開發平台。Node.js可以方便地搭建響應速度快、易於擴展的Web應用。Node.js 使用事件驅動，非阻塞I/O模型而得以輕量和高效，非常適合在分布式設備上運行數據密集型的實時應用。

Node.js的誕生給前端開發人員帶來了極大的驚喜，傳統的Web 開發者，前端使用JavaScript進行編程，服務器端代碼得用另外一種語言，比如Java、.NET、PHP 等等。但是 Node.js 出現之后，前端開發者使用JavaScript就可以前后端通吃了。

官方鏡像

官方鏡像地址：https://hub.docker.com/_/node

編寫一個簡單的Web服務器

1.編碼

使用Node.js編寫一個簡單的Web服務器非常簡單，主要需要用到http模塊，http模塊主要用於搭建 HTTP 服務端和客戶端，全部代碼如下所示：

// 加載http模塊
const http = require('http');
// 設置端口

const port = 80;

// 創建Web服務器

const server = http.createServer((req, res) => {

// 設置響應的狀態碼

res.statusCode = 200;

// 設置響應的請求頭

res.setHeader('Content-Type', 'text/plain');

// 設置響應輸出文本

res.end('Hello World !');

});

// 設置Web服務器監聽端口

server.listen(port);

2.編寫Dockerfile

Dockerfile文件如下所示：

#指定node鏡像的版本
FROM node:8.9-alpine

#對外暴露的端口

EXPOSE 80

# 復制文件

COPY . .

# 運行

ENTRYPOINT ["node","app.js"]

3.構建並運行

構建命令如下所示：

docker build --rm -f "dockerfile" -t nodetest1:latest .

運行：

docker run --rm -p 4000:80 nodetest1:latest

在日常開發中，一些簡單的腳本的編寫，為了避免反復的構建過程，大家同樣可以參考PHP一節，然后直接運行Node.js的鏡像來執行Node.js的腳本。

參考腳本如下所示：

docker run -it --rm `

--name node-running-script `

-v D:\temp\node:/usr/src/myapp `

-w /usr/src/myapp `

node:8.9-alpine node app.js

使用Hexo搭建團隊技術文檔站

Hexo 是一個快速、簡潔且高效的博客（不僅僅是博客）框架，他可以使用 Markdown（或其他渲染引擎）解析文章，在幾秒內，即可利用靚麗的主題生成靜態網頁。我們可以用其來搭建博客、文檔站點或者其他官網。接下來，我們將使用Hexo來搭建團隊技術文檔站。之所以選擇Hexo，主要原因如下：

主題豐富

Hexo的主題很多，我們在官網就能找到很多可用的主題，而且均已開源，如下所示：

插件豐富

在官網，我們就可以找到很多各種各樣的插件，比如搜索、字數統計、自動分類、百度網址提交、靜態資源壓縮等等各種各樣的開源插件：

靈活可擴展

無論是主題還是插件，均為開源。相關主題的修改也非常簡單，您只要具備一定的JavaScript和Html的知識，就可以完成對主題和插件的修改。

支持對Markdown進行渲染

無論是搭建博客還是技術文檔站，使用Markdown進行文章編寫都是需要優先考慮的。團隊成員僅需提交Markdown，就可以生成一個漂亮美觀的靜態站點，這是一件多么愜意的事情啊！

接下來，我們就演示如何一步一步的使用Hexo來構建團隊技術站點：

1.安裝

在安裝Hexo之前，我們先必須安裝好以下內容：

Node.js (Node.js的版本不得小於6.9)
Git

接下來，我們僅需使用以下命令來安裝Hexo：

npm install -g hexo-cli

npm是Node.js的包管理工具，在安裝Node.js時會順帶安裝好，通過以上命令，我們將使用npm全局安裝（安裝到全局目錄）hexo-cli。

2.初始化

接下來，我們可以開始使用Hexo建站了。首先我們需要進行一些站點初始化的工作：

hexo init <folder>

初始化完成之后，就可以看到目標目錄下多了很多內容：

接下來，我們使用npm管理工具進行安裝相關包：

npm install

3.配置站點信息

在根目錄下，我們可以找到“_config.yml”文件，通過修改該文件，我們可以在此配置大部分參數：

具體配置信息見官網說明：https://hexo.io/zh-cn/docs/configuration

4.生成靜態文件

默認情況下，Hexo進行站點初始化時，已經完成了默認主題（landscape）和內容（hello-world.md）的設置，我們可以直接執行以下命令來生成靜態文件：

hexo generate

執行之后，我們可以在“public”目錄看到以下靜態文件：

我們還可以使用命令“hexo deploy”來部署站點，比如部署到GitHub然后使用GitHub進行托管。Hexo支持多種部署方式，具體見官網：https://hexo.io/zh-cn/docs/deployment

5.使用hexo-server進行托管

我們也可以使用官方組件hexo-server進行托管我們的靜態站點，在使用之前，我們得先進行安裝：

npm install hexo-server –save

安裝完成后，就可以使用以下命令來啟動web服務器來進行查看了：

hexo server -p 5000

-p參數用於指定端口，默認端口為4000：

接下來，我們就可以用瀏覽器直接打開這個地址進行訪問了：

至此，一個簡單的靜態站點就搭建好了。我們可以配置導航鏈接，或者使用主題和插件來支持各種自定義的功能。例如如下所示的站點：

6.使用容器構建和托管

初步了解Hexo之后，我們可以使用Docker來構建和托管我們的站點。主體參考流程如下所示：

以上流程僅供參考，TeamCity的配置請參考DevOps相關章節。

Dockerfile文件如下所示：

FROM node:10.15.3-alpine
# 設置標簽

LABEL author=雪雁 email=xinlai@xin-lai.com site=https://docs.xin-lai.com

# 設置容器內端口

EXPOSE 8000

# 添加目錄

ADD . /app

# 設置當前工作目錄

WORKDIR /app

# 復制文件

COPY . .

# 設置npm並且使用npm安裝hexo以及相關插件，然后生成靜態頁並且安裝hexo-server

RUN npm config set unsafe-perm true && \

npm config set registry https://registry.npm.taobao.org && \

npm install -g hexo-cli && \

# hexo clean && \

cd src && \

npm install hexo --save && \

npm install hexo-neat --save && \

npm install --save hexo-wordcount && \

npm i -S hexo-prism-plugin && \

npm install hexo-generator-search --save && \

npm i hexo-permalink-pinyin --save && \

hexo generate && \

npm install hexo-server --save

# 設置工作目錄

WORKDIR src

# 使用hexo-server托管靜態文件

ENTRYPOINT ["hexo", "server","-p","8000"]