mac下搭建碼雲gitee+hexo博客


之前自己做了很多筆記,但都是在私有雲筆記,有些經典,有些凌亂,獨樂樂不如眾樂樂,想了想,還是做個博客吧,復習整理的過程中,希望有緣人有所收獲~

個人靜態博客,其實用不到專門買服務器,用個好點的模板,搜索、圖床、統計訪客、評論等功能都一應俱全,且搭建方便。

網上搭建方式紛繁復雜,各式各樣,該文總結了一下,只保留精華,和容易出錯的細節,並在最后記錄參考鏈接。

總體思路就是用gitee(碼雲)來做存儲(文章和圖片),不用github是個人覺得在國內訪問碼雲更快。自動生成和部署利用的是hexo框架。

前置需要裝Git、Node.js,這個在mac下直接用brew即可。

正文首先介紹如何初次創建和訪問到自己的gitee域名下的個人博客測試頁面。

然后講解如何用hexo部署一個默認的模板,並生成、發布、展現成功。

剩下的就是講解如何使用一個不錯的模板。

目前評論功能還沒摸索過,等有空測試成功后,會再記錄一篇。

在碼雲創建好同名倉庫,並新增index.html測試

如果你想你的 pages 首頁訪問地址不帶二級目錄,如ipvb.gitee.io,你需要建立一個與自己個性地址同名的倉庫,如 https://gitee.com/ipvb 這個用戶,想要創建一個自己的站點,但不想以子目錄的方式訪問,想以ipvb.gitee.io直接訪問,那么他就可以創建一個名字為ipvb的倉庫 https://gitee.com/ipvb/ipvb 部署完成后,就可以以 https://ipvb.gitee.io 進行訪問了。

創建好后,新增index.html

選擇服務-》Gitee Pages

安裝hexo,部署主題

安裝hexo客戶端

npm install -g hexo-cli

用hexo部署目錄

hexo init myblog
cd myblog
npm install

本地看效果

hexo server

訪問http://localhost:4000

先安裝部署模塊:

npm install hexo-deployer-git --save

修改_config.yml

url: https://veyronc.gitee.io/
root: /
deploy:
  type: git
  repo: https://gitee.com/veyronc/veyronc.git
  branch: master

注意配置冒號后面有個空格。

清理生成部署

hexo clean
hexo generate
hexo deploy

hexo deploy即將代碼傳到碼雲剛才建的新項目上。第一次執行會讓輸入碼雲的用戶名和密碼。

上傳完成后,需要在碼雲的服務-》Gitee Pages,里面再次點擊更新。

默認主題可能加載慢,介紹的目的是為了熟悉hexo和發布更新的操作,實際用下面的主題更好看。前面生成的文件夾刪了也沒關系。

換主題

主題可以到 https://hexo.io/themes/ 去選擇,博主選的是aircloud。

https://github.com/aircloud/hexo-aircloud-blog

不在剛才的目錄下操作了。重新找個地方。

git clone https://github.com/aircloud/hexo-aircloud-blog.git --recursive
cd hexo-aircloud-blog
npm install
hexo serve

如上一章修改_config.yml

url: https://veyronc.gitee.io/
root: /
deploy:
  type: git
  repo: https://gitee.com/veyronc/veyronc.git
  branch: master

清理、生成、部署

hexo clean
hexo generate
hexo deploy

或者您可執行下列的其中一個命令,讓 Hexo 在生成完畢后自動部署網站,兩個命令的作用是相同的。

hexo generate --deploy
hexo deploy --generate

可簡寫為

hexo g -d
hexo d -g

每次deploy變更完后,想要在訪問https://veyronc.gitee.io/的時候看到效果,都需要在碼雲的服務-》Gitee Pages,里面再次點擊更新。

添加和刪除文章

添加文章hexo new '文章新建測試'會看到

INFO  Created: ……/hexo-aircloud-blog/source/_posts/文章新建測試.md

然后去修改之。標簽可以多個。

---
title: 文章新建測試
date: 2019-03-21 01:03:47
tags:
    - 標簽1
    - 標簽2
---

刪除文章需要刪除的是目錄hexo-aircloud-blog/source/_posts里的文章

執行完后還是生成、部署、最后記得在gitee更新Pages服務。

hexo clean操作官方說明是:

Cleans the cache file (db.json) and generated files (public).

測試發現,如果不執行該命令,刪除了source/_posts里的文章,訪問頁面也看不到了,只不過還會存在gitee的public文件夾中。

文章中使用圖片

圖片也可以利用gitee存儲,就放在hexo-aircloud-blog/source/img

md文件中載入用 ![](/img/kds.jpg)

注意:博客源代碼和生成代碼分開存儲

上面介紹的一系列操作,是將博客生成代碼傳到碼雲的發布代碼倉庫。另外,設想一下如果你的本地電腦崩了怎么辦,下次配置生成是不是很麻煩,所以,整個hexo-aircloud-blog文件夾,也新建一個代碼倉庫存起來,存成私有倉庫即可。

『博客源代碼』: Hexo的源碼,包括themes目錄(博客模板),source目錄(使用MarkDown寫的博客)等

『博客生成代碼』: 執行hexo generate或者hexo server命令生成的代碼,是Hexo自動生成的,再public目錄。

博主用的方法應該是比較方便的,新建一個私有倉庫 blog-source,克隆下來后,把前面的博客生成代碼目錄里面所以文件拷過來。

則在 blog-source 根目錄下 git 操作相當於傳到博客源代碼私有倉庫blog-source。

用 hexo 命令操作的是上傳到博客生成代碼倉庫。

參考

https://gitee.com/help/articles/4136#article-header1

https://github.com/aircloud/hexo-theme-aircloud

https://blog.csdn.net/adobeid/article/details/81259381#giteement

https://wudong.tech/2018/08/29/Hexo接入碼雲評論系統/

https://blog.csdn.net/qq_34461514/article/details/79733669

https://hexo.io/docs/commands

https://hexo.io/zh-cn/docs/deployment

https://segmentfault.com/q/1010000008049369/a-1020000008049754


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM