前言
最近筆者在復習 JavaScript 基礎知識,剛看完 《JavaScript 高級程序設計(第四版)》,想再找一些優秀代碼庫鞏固一下學到的內容,自然而然得就想到了 Lodash
。
Lodash
是一個一致性、模塊化、高性能的 JavaScript 實用工具庫。在筆者的公司內使用率頗高,相信在大家的項目中也是如此,於是就想研究一下 lodash
源碼,順便做一些源碼分析,獨樂樂不如眾樂樂,寫一些文章出來與大家分享。
於是就到了這篇文章的主題,快速搭建一個文檔網站。其實筆者是有一個服務器的,域名是 https://lcs.show
,但是服務器確實帶寬有限,再加上還得自己配置 NGINX、GitHub Action 以及 https 證書等內容。
很巧看到了騰訊雲 cloudbase 服務,可以快速搭建靜態網站,如果你沒有域名的話會自動分配一個域名(但是會比較難記),可以的話還是自己注冊一個域名,也可以很方便地申請並配置 https 證書,如果搭配 GitHub Action 使用的話可以說是完全不用考慮服務器維護的內容了。
接下來就來講一下如何搭建以及部署。
搭建及部署
本文是以 VuePress 為例進行搭建部署,VitePress、Next、Docsify 等部署大同小異。
項目初始化
- 安裝 CLI
npm install -g @cloudbase/cli@latest
- 初始化一個應用
tcb new cloudbase-test vuepress
使用該 CLI 是需要進行登錄的,如果 CLI 檢測到你當前沒有登錄的話會自動打開瀏覽器跳轉到騰訊雲登錄頁面,登錄成功后返回命令行,繼續下一步操作:
接下來選擇你認為合適的一個服務器地點,在這里我選擇上海。
接下來會選擇關聯環境,如果你當前沒有環境的話可直接選擇「創建新環境」,CLI 會自動打開瀏覽器跳轉到「創建新環境」頁面,創建新環境如下圖,在這里我選擇使用 VuePress 模板進行創建:
選擇完成后點擊下一步即可:
創建成功后返回命令行,會顯示正在初始化環境,稍等幾分鍾就可以直接創建項目。創建成功后會生成以下目錄結構的項目:
├── README.md
├── cloudbaserc.json
├── guides
│ └── README.md
└── package.json
項目部署
- 安裝依賴
npm i
- 構建部署
npm run deploy
- 部署成功
執行 npm run deploy
稍等片刻之后即可部署成功,命令行會返回一個訪問域名,筆者的為 https://cloudbase-test-9gccjnk3e393c02a-1256377994.tcloudbaseapp.com/vuepress/ ,點擊即可訪問示例網站,如下:
到這里為止,其實部署工作就算是結束了,無需自己配置 NGINX 等復雜繁瑣的操作,這就是雲服務的魅力,同時該服務按量計費,對於筆者來說費用可以說是非常低了。
但是,僅此還不夠,我們要配置 GitHub Action 之后,才能算完全放手部署這件事,做到完全自動化,將日常工作精力專注於文檔編寫就可以了。
GitHub Action 配置
如果初始化了一個項目的話,會看到項目中有一個 cloudbaserc.json
文件,該文件為 cloudbase 配置文件,文件中有一個 envId
配置項,這屬於敏感信息,請注意千萬不要上傳到 GitHub 中,將該配置信息從 cloudbaserc.json
中刪除!
既然不能上傳的話,我們應該如何配置呢,答案很簡單,使用 GitHub secret 即可。需要在 騰訊雲控制台 新建秘鑰,新建完成后,打開你的 GitHub 倉庫進行如下設置:
創建 ENVID、SECRETID、SECRETKEY 三條 secret,其中 ENVID 在 應用列表中可見,配置完成后如下所示:
接下來在項目的 .github/workflows
目錄下創建 deploy.yml
文件,內容如下:
name: 自動化部署
on:
push:
branches: [ master ]
pull_request:
branches: [ master ]
jobs:
deploy:
runs-on: ubuntu-latest
name: deploy
steps:
- name: Checkout
uses: actions/checkout@v2
- name: Deploy to Tencent CloudBase
uses: TencentCloudBase/cloudbase-action@v2
with:
secretId: ${{ secrets.SECRETID }}
secretKey: ${{ secrets.SECRETKEY }}
envId: ${{ secrets.ENVID }}
然后將你的項目代碼 push 到 GitHub 就可以完成自動化部署了,之后就可以專心進行文檔編寫,無需關心服務器維護這樣的事情了。
快樂搬磚~
總結
像騰訊雲 cloudbase 這樣的雲服務可以說真的方便了很多,可以直接部署自己的靜態博客或者文檔等站點,一鍵部署,無需運維,豈不美哉。
前面說到筆者最近正在寫 lodash 源碼解析,地址是 lodash.lcs.show,GitHub 地址為 https://github.com/jacob-lcs/lodash-source-code-analysis當然還處於剛開始的階段,大家有興趣的話歡迎關注~