Docsify + Serverless Framework怎么快速創(chuàng)建個人博客系統(tǒng)

這篇文章給大家介紹Docsify + Serverless Framework怎么快速創(chuàng)建個人博客系統(tǒng)，內(nèi)容非常詳細(xì)，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。

 用 docsify 創(chuàng)建博客系統(tǒng)，然后用 Serverless Framework 部署服務(wù)，三分鐘就搞定了！

簡單介紹一下：

• docsify：一個神奇的文檔網(wǎng)站生成工具，不同于 GitBook、Hexo 的地方是它不會生成將 .md 轉(zhuǎn)成 .html 文件，所有轉(zhuǎn)換工作都是在運(yùn)行時進(jìn)行。而且如果只是需要快速搭建一個小型的文檔網(wǎng)站，或者不想因?yàn)樯傻囊欢?.html 文件「污染」 commit 記錄，只需要創(chuàng)建一個 index.html 就可以開始寫文檔；

• Serverless Framework：在 GitHub 上有三萬顆星，業(yè)界非常受歡迎的無服務(wù)器應(yīng)用框架，開發(fā)者無需關(guān)心底層資源即可部署完整可用的 Serverless 應(yīng)用架構(gòu)。

接下來我們分三步進(jìn)行：安裝與初始化 → 配置 yml 文件 → 部署

▎安裝與初始化

首先確保系統(tǒng)包含以下環(huán)境：

• Node.js (Node.js 版本需不低于 8.6，建議使用 10.0 及以上版本)

• Git

1. 安裝 Serverless Framework

$ npm install -g serverless

2. 安裝 docsify

$ npm i docsify-cli -g

3. 初始化項(xiàng)目

$ docsify init docsify

初始化成功后，可以看到 ./docsify 目錄下創(chuàng)建的幾個文件

• index.html 入口文件

• README.md 會做為主頁內(nèi)容渲染

直接編輯 docsify/README.md 就能更新網(wǎng)站內(nèi)容，當(dāng)然也可以寫多個頁面，這是后話。

4. 本地預(yù)覽

運(yùn)行以下命令，并通過瀏覽器訪問 http://localhost:3000 即可方便地預(yù)覽效果，而且提供 LiveReload 功能，可以實(shí)時預(yù)覽。

$ docsify serve docsify

▎配置 yml 文件

在項(xiàng)目目錄下，創(chuàng)建 serverless.yml 文件：

$ touch serverless.yml

將以下內(nèi)容寫入上述的 yml 文件里：

# serverless.yml

mydocsify:
  component: "@serverless/tencent-website"
  inputs:
    code:
      src: ./docsify # Upload static files generated by docsify
      index: index.html
      error: index.html
    region: ap-guangzhou
    bucketName: my-bucket

配置完成后，文件目錄如下：

.
├── docsify
|   ├── index.html
|   └── README.md
└── serverless.yml

▎部署

通過 sls 命令進(jìn)行部署，這里還可以添加 --debug 參數(shù)來查看部署過程中的信息，

$ sls --debug

如果你的賬號未 登陸 或 注冊 騰訊云，可以直接通過微信掃描命令行中的二維碼，從而進(jìn)行授權(quán)登陸和注冊。這也是我覺得特別方便的一個地方！

部署過程中，terminal 顯示信息示意：

訪問命令行輸出的 url，即可查看使用 Serverless Framework 部署的 docsify 文檔網(wǎng)站啦~

關(guān)于Docsify + Serverless Framework怎么快速創(chuàng)建個人博客系統(tǒng)就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。