1. 程式人生 > 其它 >Hexo 搭建個人部落格

Hexo 搭建個人部落格

什麼是 Hexo ?

Hexo 是一個快速、簡潔且高效的部落格框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。而且安裝部署也是極其簡單的,很容易上手,我們只需幾條命令就可以將自己的個人部落格搭建起來

安裝

必備環境:Nodejs 、Git , 然後我們通過下面幾條命令就可以跑起來了

    npm install hexo-cli -g  #全域性安裝hexo-cli工具
    hexo init blog           # 初始化專案資料夾
    cd blog                  # 進入目錄
    npm i                    # 安裝依賴
    hexo server              # 啟動服務

部署

Hexo 支援多種部署,這裡只列出3種,詳細請點選下面連結瞭解,下面我會著重講 如何使用 Vercel 來部署我們的個人部落格
1)--->使用 GitHub Pages 自動化部署,詳情請看這裡 -> GitHub
2)--->使用 GitLab Pages 自動化部署,詳情請看這裡 -> GitHub

Vercel 簡介

Vercel是一個用於前端框架和靜態站點的平臺,類似GitHub Pages ,但遠比GitHub Pages強大多了,我們將GitHub授權給vercel後,只要我們每次git push 程式碼到Git倉庫後,vercel會自動部署我們的專案!

Vercel不僅支援部署靜態站點還支援部署動態的網站,還支援部署serverless介面,而且這些功能都是免費的!注意:是免費的!白嫖黨的福利,我用了之後給我感覺就是:真香!

Vercel還支援自動配置https,不用我們去申請什麼證書,還有一大推的證書配置!

大家可以去官網看看 -->vercel,不多說,搞起來!

如何使用 Vercel 來部署專案

首先在我們的GitHub倉庫中新建一個部落格的倉庫(倉庫名自取,我的是blog),新建倉庫的時候要注意一下,如果你不想你的專案暴露出去的話,最好是將倉庫改為私有的...

新建完倉庫會出現下面的git命令,我們就可以根據下面的命令將我們本地的專案推送到我們的新倉庫中

我們稍微改一下上面的命令,首先進入我們本地專案的根目錄(blog)

    git init # 初始化目錄
    git add . # 將所有檔案新增到本地倉庫
    git commit -am "add all file" # 提交
    git remote add origin xxxx.git # 寫你新建倉庫的地址,複製貼上就行了
    git push origin master # 這裡寫提交到master,因為我之前寫main的時候報錯,這裡還會有一個問題,如果你是通過ssh的話必須配置ssh的金鑰,具體配置百度一下(github 配置本地ssh金鑰)

配置 Vercel

進入vercel官網 vercel,然後登入我們的賬號(GitHub賬號),第一次登入完成後會提示你安裝授權外掛的,我們安裝就行了
然後我們在首頁會看到這樣的頁面

授權給vercel後,左邊我們就可以看到自己GitHub裡面所有的專案了,然後我們找到自己的部落格專案,點選Import ,然後填上我們專案名稱(PROJECT NAME),選擇FRAMEWORK PRESET,選擇Hexo,點選Deploy就可以了

部署成功後會有一個完成的特效,基本出現下面的這個頁面就完成了,訪問的話,我們將下面的 DEPLOYMENT 的地址複製貼上開啟一個新的標籤頁訪問就可以了

-預覽地址:https://www.ailance.top