前言
去年就有在 Github 搭建博客的想法，但是因?yàn)楣ぷ魈R置了，昨天想起來這事兒，于是網(wǎng)上各種查閱資料，感覺雖然搭建方式比較多，但都不是很全，走了很多彎路，折騰了我一天，才終于搭建好了自己的 GIthub 博客，在此記錄梳理一下，希望可以幫到大家，歡迎交流！
博客采用的是Hexo框架（因?yàn)橹С諱arkdown語法），使用的是Butterfly主題，搭建過程中的參考鏈接如下：
Hexo 官方文檔：https://hexo.io/zh-cn/docs/
Hexo 官方主題：https://hexo.io/themes/
Butterfly 主題 GIthub：https://github.com/jerryc127/hexo-theme-butterfly
Butterfly 主題doc（主要包含主題配置及一些自定義）：https://butterfly.js.org/archives/
最終效果：https://wuqiuxu.github.io
一、準(zhǔn)備GIthub倉庫
-
首先你需要在 Github 有一個(gè)自己的賬號(hào)
-
進(jìn)入個(gè)人主頁可以看到
Repositories，點(diǎn)擊進(jìn)入倉庫
-
新建一個(gè) Github 倉庫，倉庫名稱填寫
github用戶名.github.io（ps：因?yàn)槲乙呀?jīng)搭建過了，所以下圖會(huì)出現(xiàn)倉庫已存在的警告）
-
點(diǎn)擊最下方的
Create repository提交倉庫
-
倉庫生成后，復(fù)制自己的倉庫地址，后續(xù)部署的時(shí)候需要（如果倉庫里面沒有文件，進(jìn)入之后就是圖一的樣子，否則是圖二，紅框里就是地址）
二、本地安裝git
- Mac 系統(tǒng)：
brew install git - 其他系統(tǒng)可參考官網(wǎng)：https://git-scm.com/downloads
三、本地安裝node.js
- 安裝 nvm
- Mac系統(tǒng)：
brew install nvm - 其他系統(tǒng)可參考官網(wǎng)：https://nodejs.org/zh-cn/download
- 配置環(huán)境變量：
vim ~/.zshrc
export NVM_DIR=~/.nvm
source $(brew --prefix nvm)/nvm.sh
- 生效環(huán)境變量：
source ~/.zshrc - 查看 node.js 的可用版本：
nvm ls-remote - 安裝 node.js（版本需不低于 10.13，官方建議使用 Node.js 12.0 及以上版本）：
nvm install v16.20.0
- 使用指定版本：
nvm use v16.20.0 - 指定每次啟動(dòng)終端所使用的版本：
nvm alias default v16.20.0
四、本地安裝Hexo
- 安裝 Hexo：
npm install -g hexo-cli（這里提示可以更新npm版本，可以更新一下：npm install -g npm@9.7.1）
五、搭建博客
- 準(zhǔn)備一個(gè)文件夾：
mkdir blog - 初始化：
hexo init blog
- 進(jìn)入文件夾：
cd blog - 安裝：
npm install
- 查看生成的文件：
ls
- 克隆 butterfly 主題倉庫：
git clone -b master ``https://github.com/jerryc127/hexo-theme-butterfly.git`` themes/butterfly，然后在 themes 下就會(huì)多一個(gè)主題目錄
- 修改
blog目錄下的_config.yml（注意不是主題目錄下的_config.yml），把 theme 的值改為 butterfly
- 配置主題，可以參考這篇文章：https://butterfly.js.org/posts/4aa8abbe/（這一步可以先跳過，等搭建好之后再修改）
- 生成文章：
hexo new post "文章標(biāo)題"，然后就可以在 blog/source/_posts 下生成的md文件編寫了（這一步也可以先跳過，等搭建好之后再來寫） - 生成靜態(tài)文件 public（每次修改主題配置后都需要重新生成）：
hexo generate，縮寫hexo g
- 啟動(dòng)本地服務(wù)器：
hexo server，縮寫hexo s（訪問地址為：http://localhost:4000/，可以在本地查看頁面，ctrl + c可以結(jié)束服務(wù)）
- 清除緩存文件 db.json 和已生成的靜態(tài)文件 public ：
hexo clean，縮寫hexo cl
有時(shí)候?qū)φ军c(diǎn)的更改不生效，可能需要先運(yùn)行該命令再重新生成文件
六、部署到Github
-
修改
blog目錄下的_config.yml（注意不是主題下的_config.yml）
a. type 類型配置為 git
b. repo 那里配置為自己的Github倉庫地址
按照yml文件格式要求，:后面必須留有一個(gè)空格 -
安裝一鍵部署插件：
npm install hexo-deployer-git --save文章來源：http://www.zghlxwxcb.cn/news/detail-616021.html -
一鍵部署到Github：
hexo deploy，縮寫hexo d文章來源地址http://www.zghlxwxcb.cn/news/detail-616021.html
到了這里，關(guān)于在Github搭建個(gè)人博客-詳細(xì)步驟整理的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
