前情提要
寫這篇文的目的
- 記錄自己搭建過程,便于以后快速復(fù)用
- 總結(jié)經(jīng)驗(yàn)和自己踩的坑,給其他小伙伴一些參考(由于是搭建后寫的,所以沒有參考圖片)
介紹
- 初步效果參考我的博客:hermia的個人博客
- 本博客基于Hexo框架,使用github托管
- 使用自定義域名:
hermiablog.com
- hexo主題:
hexo-theme-matery
主題特性
- 簡單漂亮,文章內(nèi)容美觀易讀
- Material Design 設(shè)計
- 響應(yīng)式設(shè)計,博客在桌面端、平板、手機(jī)等設(shè)備上均能很好的展現(xiàn)
- 首頁輪播文章及每天動態(tài)切換 Banner 圖片(我選的圖片都很美,期待你的每天訪問哦)
- 瀑布流式的博客文章列表(文章無特色圖片時會有漂亮的圖片代替)
- 時間軸式的歸檔頁
- 詞云的標(biāo)簽頁和雷達(dá)圖的分類頁
- 豐富的關(guān)于我頁面(包括關(guān)于我、文章統(tǒng)計圖、我的項(xiàng)目、我的技能、相冊等)
- 可自定義的數(shù)據(jù)的友情鏈接頁面
- 支持文章置頂和文章打賞
- 支持 MathJax
- TOC 目錄
- 可設(shè)置復(fù)制文章內(nèi)容時追加版權(quán)信息
- 可設(shè)置閱讀文章時做密碼驗(yàn)證
- Gitalk、Gitment、Valine 和 Disqus 評論模塊(推薦使用 Gitalk)
- 集成了不蒜子統(tǒng)計、谷歌分析(Google Analytics)和文章字?jǐn)?shù)統(tǒng)計等功能
- 支持在首頁的音樂播放和視頻播放功能
- 博客正在建設(shè)中,更多功能敬請期待…
跟著本篇文章,你會實(shí)現(xiàn):
- 使用
github用戶名.github.io
/自定義域名訪問博客 - 設(shè)置自己喜歡的主題
軟件準(zhǔn)備
- git
- Node.js
- 任一編輯器
- 注意:命令行操作使用git,文件內(nèi)容編輯使用vscode
參考官方文檔
- Github Pages文檔
- Hexo官方文檔
低配版:github域名+默認(rèn)hexo主題
步驟
- 新建本地倉庫
- 安裝hexo
- 創(chuàng)建github倉庫
- 鏈接遠(yuǎn)程倉庫
- 部署
新建本地倉庫
我的電腦里同時使用了gitee和github倉庫,且使用了不同的用戶名及郵箱,因此
- 不能使用全局的用戶名、郵箱配置
- 所以在使用SSH鏈接遠(yuǎn)程倉庫時要單獨(dú)配置
- 首先在本地新建空文件夾myblog
- 注意:不要使用
git init
來初始化倉庫 - 因?yàn)閔exo安裝必須在空文件夾
安裝Hexo
- 右擊剛剛新建的文件夾myblog,點(diǎn)擊Git Bash Here打開git窗口
- 輸入
npm install -g hexo-cli
安裝Hexo - 驗(yàn)證是否安裝成功
hexo -v
- 初始化Hexo:
hexo init
- 查看是否能在本地啟動成功:
hexo s
;啟動服務(wù)器,訪問網(wǎng)址之后可以看到hexo的初始界面;停止服務(wù)器:ctrl+c
npm install -g hexo-cli
hexo -v
hexo init
hexo s
Hexo相關(guān)目錄文件
- node_modules是node.js各種庫的目錄
- public是生成的網(wǎng)頁文件目錄
- scaffolds里面就三個文件,存儲著新文章和新頁面的初始設(shè)置
- source是我們最常用到的一個目錄,里面存放著文章、各類頁面、圖像等文件
- themes存放著主題文件,一般也用不到。
- 我們平時寫文章只需要關(guān)注source/_posts這個文件夾就行了
創(chuàng)建github倉庫
注意:倉庫名必須是
用戶名.github.io
,這有這樣做,部署完之后才能使用http://用戶名.github.io
訪問
- 打開
https://github.com/
,新建一個項(xiàng)目倉庫 - 選擇公開倉庫和需要README文件
- git倉庫默認(rèn)主分支名為main,建議修改為master,和本地倉庫的主分支名相同
使用SSH密鑰鏈接遠(yuǎn)程倉庫
- 回到本地倉庫的git界面
- 綁定用戶名和郵箱
# 全局
git config --global user.name "yourname"
git config --global user.email "youremail"
# 局部
git config --global user.name "yourname"
git config --global user.email "youremail"
# 查看用用戶名和郵箱信息是否配置成功
git config --list
- 如果你和我一樣有多個倉庫,就去掉 --global
- 郵箱就是你github綁定的郵箱
- 檢查是否配置成功
- 創(chuàng)建SSH
ssh-keygen -t rsa -C 郵箱名
- 后面是自己注冊github的郵箱,然后敲三次回車
- 接著就會發(fā)現(xiàn)
C:\Users\用戶名
下多了一個.ssh目錄,打開后有一個公鑰,一個私鑰。id_rsa.pub是公鑰 - 我們需要打開它,復(fù)制里面的內(nèi)容
- 打開github,在頭像下面點(diǎn)擊settings,再點(diǎn)擊SSH and GPG keys,新建一個SSH,標(biāo)題隨意取,把剛剛復(fù)制id_rsa.pub里面的信息粘貼到鑰匙框
- 在git bash輸入
ssh -T git@github.com
;如果出現(xiàn)...successfully...
就成功了
將hexo和GitHub關(guān)聯(lián)
- 打開本地倉庫,博客文件夾,在根目錄找到
_config.yml
文件,使用vscode或任一編輯器打開 - 修改配置:
deploy:
type: git
repository: github地址
branch: master
- 獲取repository:打開github倉庫–>Code–>復(fù)制SSH地址填入即可
- 注意:hexo的所有文件,在修改時切記冒號后面有空格,否則報錯
部署
- 安裝deploy-git
npm install hexo-deployer-git --save
- 依次執(zhí)行以下命令
# 清除緩存文件 (db.json) 和已生成的靜態(tài)文件 (public)
hexo c
# 生成靜態(tài)文件
hexo g
# 部署網(wǎng)站
hexo d
- 注意:雖然我們使用的是git,但是
hexo d
會自動把文件傳到github上;不需要再使用git push
了
- 完成以上步驟,你就可以使用xxx.github.io來訪問你的博客啦
- 以后寫文章,只需要以下命令
hexo new post "文章標(biāo)題"
hexo c
hexo g
hexo d
使用
- 新建文章 hexo new post 標(biāo)題
- 部署
#清理之前的生成
hexo c
# 生成靜態(tài)網(wǎng)站
hexo g
#開啟本地服務(wù) ctrl+c 停止
hexo s
#上傳到github
hexo d
自定義域名
- 首先,自定義域名需要花錢買,華為云/騰訊云/阿里云都可以
- 購買之后需要解析域名
github綁定
- 打開github倉庫–>點(diǎn)擊setting–>找到pages–>拉到Custom domain處,填寫你購買的域名,進(jìn)行綁定
- 此時項(xiàng)目根目錄會自動生成CNAME文件,如果沒有的話自己創(chuàng)建一個,文檔內(nèi)容為你的域名
DNS配置
- 進(jìn)入華為云控制臺,打開云解析服務(wù)DNS
- 在域名解析集中添加一條
- 記錄類型為CNAME
- 記錄值為博客的github倉庫名,我的是hermiablog.github.io
- 等待一段時間就可以使用域名訪問了
github的使用
git——倉庫配置
!!!首先 如果有倉庫的用戶名及郵箱不一樣 就不要把它設(shè)置為全局
- git安裝后,點(diǎn)擊文件夾–>右擊 git bash here打開
- 初始化本地倉庫
git init
- 設(shè)置用戶名和有效
git config user.name "你的名字(一定要是英文的)"
git config user.email "你的郵箱"
# 查看用用戶名和郵箱信息是否配置成功
git config --global --list
# 刪除全局設(shè)置
git config --global --unset user.name
git config --global --unset user.email
添加SSH公鑰
- 創(chuàng)建SSH密鑰對
ssh-keygen -t rsa -C 郵箱名
- 如果不需要設(shè)置密碼,可以直接按Enter鍵
- 之后就會在用戶主目錄下的
.ssh
文件夾中生成以下兩個文件:
id_rsa
id_rsa.pub
- 其中id_rsa為私鑰,id_rsa.pub為公鑰
- 將自定義路徑的私鑰添加到ssh秘鑰搜索列表中
//連接認(rèn)證agent(身份驗(yàn)證代理)
ssh-agent bash
//修改私鑰路徑
ssh-add ~/.ssh/id_rsa_github
- 將公鑰內(nèi)容粘貼到自己github/Gitee的設(shè)置中
- 用記事本打開id._rsa.pub文件,復(fù)制內(nèi)容
- 登錄自己的github或gitee,在個人設(shè)置中找到“安全設(shè)置”–“ssh公鑰”,標(biāo)題自定,將公鑰粘貼進(jìn)去
- 測試本機(jī)能否與github/gitee使用ssh通信
ssh -T git@gitee.com
//或
ssh -T git@github.com
-
ssh返回 “……successfully ……”,這表示可以與遠(yuǎn)程愉快的通信了
-
本地倉庫與GitHub遠(yuǎn)程倉庫進(jìn)行關(guān)聯(lián)
git remote add origin 遠(yuǎn)程倉庫地址(HTTP/SSH)
將本地代碼推送到github
- 可以將已經(jīng)做好的項(xiàng)目推送到遠(yuǎn)程
- 也可以解決git clone會嵌套一個文件夾的問題
本地
- 新建空文件夾
- 右擊使用Git Bash打開文件夾,git init初始化倉庫
- 配置用戶名和郵箱
git config user.name "你的名字(一定要是英文的)"
git config user.email "你的郵箱"
- 創(chuàng)建SSH密鑰對
ssh-keygen -t rsa -C 郵箱名
// 如果不需要設(shè)置密碼,可以直接按Enter鍵
- 之后就會在用戶主目錄下的.ssh文件夾中生成以下兩個文件:
id_rsa、id_rsa.pub;其中id_rsa為私鑰,id_rsa.pub為公鑰 - 打開id_rsa.pub,復(fù)制內(nèi)容,將公鑰內(nèi)容粘貼到自己github/Gitee的設(shè)置中
- 將自定義路徑的私鑰添加到ssh秘鑰搜索列表中
//連接認(rèn)證agent(身份驗(yàn)證代理)
ssh-agent bash
//修改私鑰路徑
ssh-add ~/.ssh/id_rsa
- 測試本機(jī)能否與github/gitee使用ssh通信
ssh -T git@github.com
//ssh返回 “……successfully ……”,這表示可以與遠(yuǎn)程愉快的通信了
- 修改本地倉庫主分支的命名
git branch -m master main
- 本地倉庫與GitHub遠(yuǎn)程倉庫進(jìn)行關(guān)聯(lián)
git remote add origin 遠(yuǎn)程倉庫地址(HTTP/SSH)
- 將遠(yuǎn)程倉庫拉取到本地(可以創(chuàng)建一個README文檔,有內(nèi)容可以看到變化)
git pull origin main
- 將項(xiàng)目文件復(fù)制到本地倉庫(node_module除外)
- 將項(xiàng)目文件推送到遠(yuǎn)程
git add .
git commit -m ""
git push origin main
git基本操作
- 將所有文件添加到暫存區(qū)中
git add .
- 檢測當(dāng)前git倉庫的狀態(tài)
git status
- 將暫存區(qū)中的更改保存到版本庫中,并對本次的更改添加注釋
git commit -m "XXX"
- 命令來檢測當(dāng)前git倉庫的狀態(tài)
git status
- 查看日志
git log
- 創(chuàng)建新分支
git branch 分支名
- 查看所有分支
git branch
- 切換分支
git checkout 分支名
或
git switch 分支名
- push到遠(yuǎn)程倉庫上
git push origin 分支名
將文件提交到分支上文章來源:http://www.zghlxwxcb.cn/news/detail-827693.html
- 切換到需要提交的分支上面
git checkout 分支名
- 提交到分支上面
git add 文件名/.
git commit -m "描述"
git push origin 分支名
- 切換到主分支
git checkout main
- 將本地分支和合并到本地主分支上
git merge 分支名
- 推動到遠(yuǎn)程倉庫
git pull origin main
刪除分支文章來源地址http://www.zghlxwxcb.cn/news/detail-827693.html
- 查看所有的分支
git branch -a
- 刪除遠(yuǎn)程分支
git push origin --delete 分支名
- 刪除本地分支
git branch -D 分支名
到了這里,關(guān)于博客搭建教程Github+Hexo+hexo-theme-matery主題的文章就介紹完了。如果您還想了解更多內(nèi)容,請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!