通過gitee和hexo搭建個人博客
本文首發:https://www.somata.net/2019/build_blog_with_gitee_hexo.html
首先准備軟件:
- git (提供命令git) git官網
- notepad++(方便編輯)notepad++官網
- nodejs(hexo依賴)nodejs官網
- 7z(壓縮包)7z官網
鏈接:https://pan.baidu.com/s/1OWnJMV1kI86aLUZZEkt6Yw 提取碼:im6o 這里整合好了。
還有碼雲主頁
安裝
nodejs、git、notepad++和7z的安裝過程省略。主要要說的是hexo的安裝和配置。
再以上幾個安裝好后,注意測試是否可以再命令行可以使用:git
,npm
這里雖然使用的是Windows值作但是全部都是使用命令完成,與Linux的命令相同,所以可以Linux也是可以完成的。
Win+R-> 'cmd' 打開命令行
首先需要配置npm的國內源
npm config set registry https://registry.npm.taobao.org #配置國內的鏡像源
npm info hexo # 測試查看hexo的安裝信息,是否是taobao.org的源
然后再是安裝hexo:
npm install -g hexo # 通過npm安裝hexo
# -g 指定全局安裝,可以使用hexo命令
我這里再切換到桌面路徑進行操作
hexo init test # 初始化創建,會再桌面創建test文件夾
cd test # 進入test目錄
npm install # 進一步安裝hexo所需文件
這樣hexo就安裝完成了,接下來就可以啟動hexo
了
hexo clean # 清除所有記錄
hexo generate # 生成靜態網頁
hexo server -p 80 # 啟動服務
然后使用瀏覽器訪問http://server_ip
主題配置
如果不喜歡這個主題可以換一個
比如next主題,next官網 next的github網頁,去github下載壓縮包然后放到test下的themes目錄下。
然后配置_config.yml
……
theme: hexo-theme-next-5.1.4 # 這里需要注意:后面要有一個空格,名稱要和theme下的主題目錄名稱相同。
……
hexo的其他配置參考hexo官方文檔
next的配置參考next官方文檔
然后重啟hexo服務
hexo clean # 清除所有記錄
hexo generate # 生成靜態網頁
hexo server -p 80 # 啟動服務
然后重新訪問網頁,就會發生變化
生成blog
生成blog:
hexo new test # 生成主頁,在test/source/_posts下會生成test.md文件
所有網頁都時通過md文件來顯示的,如果想要學習md->markdown語法,可以參考原作者markdown解釋
上傳到gitee
gitee主頁
再gitee創建自己的賬戶,然后再創建一個自己倉庫
在創建倉庫完成后進入到倉庫
復制URL,到hexo的配置文件_config.yml
……
deploy:
type: git # type為git
repo: https://gitee.com/somata/somata # 倉庫的URL
……
這里先安裝一個hexo的插件
npm install hexo-deployer-git --save # 安裝git插件
git config --global user.email *********@qq.com # 設置gitee郵箱(gitee的注冊郵箱)
git config --global user.name '****' # 設置用戶名(git的注冊昵稱)
hexo deploy # 上傳到gitee
# 在上傳時,需要再次輸入gitee的注冊郵箱作為username,賬戶密碼作為password
上傳完成之后,倉庫就會多出以下文件
然后哦選擇gitee pages 網頁解析服務
然后選擇開啟 或 更新即可。注意需要綁定手機號,否則不允許使用pages服務。然后訪問網址
這里需要注意,每次重新上傳網頁后,都需要到這里來更新網頁
解決hexo博客網頁無法使用圖片問題
npm install hexo-asset-image --save # 安裝hexo插件
# 這里還要注意修改_config.yml中的一個點
……
post_asset_folder: true
……
hexo new test # 生成新的網頁
位置在 test/source/_posts下,會同時生成test目錄和test.md 網頁,將需要的圖片放置到test目錄下,test.md就可以正常解析了,注意:要在圖片路徑直接寫成同目錄下即可。
本文經「原本」原創認證,作者乾坤盤,訪問yuanben.io查詢【3SCNT0GH】獲取授權信息。