即將成爲史上最具用戶體驗的Hexo+GitHub Pages搭建博客的教程(持續更新中)

前言

網上關於Hexo+Github Pages搭建博客的教程不少,可是參閱不少博文,都是表達不夠清晰,繞來繞去。基於此,我想以一個初來者的角度寫一篇儘量靠譜的教程,方便你們快速搭建好。html

大體流程

  1. 搭建Node.js環境node

  2. 搭建Git環境git

  3. 搭建本地Hexogithub

  4. 將本地Hexo與遠程GitHub Pages關聯npm

  5. Hexo的經常使用操做(持續更新中)windows


1.搭建Node.js環境

爲何要按照Node.js環境,由於Hexo是基於Node.js編寫的。瀏覽器

去Node.js官網:https://nodejs.org/download/r... 下載安裝包 v6.11.3
保持默認設置,一路next點擊便可安裝完成。
而後win+RCMD,輸入node -vnpm -v ,出現對應的node的版本號和npm版本號,代表Node.js安裝成功!bash

clipboard.png

2.搭建Git環境

使用Git將本地的Hexo生成的網頁代碼push到GitHub上。hexo

2.1安裝Git bash

Git是一款免費、開源的分佈式版本控制系統,用於開發過程當中代碼版本控制和協做。
在Git官網https://git-for-windows.githu... 下載安裝便可。框架

clipboard.png

安裝好後,右擊菜單中會有下做圖所示的快捷菜單,在命令窗口輸入git --version ,顯示出對應版本,表面安裝成功!
clipboard.png
clipboard.png

2.2 GitHub Pages配置

若是沒有Git帳戶,先註冊,網址 https://github.com/
註冊好後,新建一個repository(倉庫)爲Github Pages的倉庫
Github Pages倉庫命名規範是: yourname.github.io

clipboard.png

2.3用SSH keys關聯Hexo與Github Pages

ssh-keygen -t rsa -C "註冊Git的郵箱地址"

在回車中會提示你輸入一個密碼,這個密碼會在你提交項目時使用,若是爲空的話提交項目時則不用輸入,咱們按回車不設置密碼。

打開 C:\Users\bxm09\.ssh\id_rsa.pub,此文件裏面內容爲剛纔生成的密鑰,準確的複製這個文件的內容,粘貼到 https://github.com/settings/sshnew SSH key

能夠輸入下面的命令,看看設置是否成功,git@github.com的部分不要修改:

ssh -T git@github.com

3.搭建本地Hexo

3.1安裝Hexo

Hexo 是一個快速、簡潔且高效的博客框架。Hexo 使用 Markdown(或其餘渲染引擎)解析文章,在幾秒內,便可利用靚麗的主題生成靜態網頁。
更多關於Hexo,請點擊https://hexo.io/zh-cn/docs/

新建一個文件夾,譬如命名爲blog,右擊選擇Git Bash Here,使用npm安裝Hexo,步驟以下:

1  npm install hexo-cli -g
2  hexo init blog
3  cd blog
4  npm install
5  hexo server

此時在瀏覽器中打開[http://localhost:4000/ 瀏覽博客了

clipboard.png

  • 執行hexo server提示 FATAL Port 4000 has been used. Try other port instead.,通常是默認的4000端口被佔用,那麼把hexo server改爲任意指定的其餘端口便可,如改爲4322端口,即hexo server -p 4322

  • 執行hexo server提示找不到該指令,那是由於在Hexo 3.0 後server被單獨出來了,須要安裝server,安裝的命令以下:npm install hexo -server --save


3.2配置Deployment

_config.yml文件中,找到Deployment,而後按照以下修改,用戶名改爲你的:
注意冒號:後面要空一格

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:yourname/yourname.github.io.git
  branch: master

3.3本地文件提交到Git Pages

// 刪除舊的 public 文件
hexo clean
// 生成新的 public 文件
hexo generate
或者
hexo g
// 開始部署
hexo deploye
或者
hexo d

在瀏覽器中輸入 https:/yourname.github.io (用戶名改爲你的)看到了 Hexo 與 GitHub Pages 已經成功關聯了。

若上述操做失敗,則須要安裝一個擴展: npm install hexo-deployer-git --save

至此,基本博客已經搭建和關聯完成。Cheer!!!

clipboard.png

相關文章
相關標籤/搜索