配置環境
- mac OS
- Git
- Hexo 3.0+
- Note.js
- npm
- GitHub賬號
這裏所有的操作流程都是在mac上做的,但是Windows也可以參考。
你需要知道的
在配置之前我想先把全部流程簡要敘述一下,以免在某個環節懵逼, 同時你幾乎可以按照如下的說明完成部分的準備工作:
1. 創建GitHub賬號,並創建一個項目,項目的名稱格式必須是:你的用戶名.github.io,這將會是你今後訪問博客的域名,不要妄想使用自己喜歡的名字。在創建項目的時候會讓你填寫或勾選一些東西,除項目名稱之外,其他默認就好。
2. 安裝Git -> 安裝Note.js -> 安裝Hexo (注意這裏的順序)。
3. 在本地創建文件夾:你的用戶名.github.io 接下來對博客所有的相關操作都是在這裏完成的,爲了方便描述,在後面我將稱這個文件夾爲博客文件。
4. 進入博客文件,初始化Hexo。
5. 將Hexo部署到你的GitHub。
接下來我們將直接從Hexo的安裝開始,其餘操作都可以輕鬆並準確的在百度得到答案。
開始Hexo的安裝
到了這裏你應該已經成功安裝了Git、Note.js,同時擁有了自己的GitHub賬號,並且按照上面的命名格式創建了一個項目。現在開始正式對Hexo進行配置了。
安裝Hexo
打開終端,進入root模式
su
安裝Hexo
npm install hexo-cli -g
命令執行完畢後執行
npm install --save
至此,Hexo已經安裝完畢。
初始化你的博客文件
進入到你的博客文件,記住,這個文件的名字要跟你GitHub上的項目名稱一樣。(其實這裏我不是太確定是不是要一樣……)
cd yourBlogFilePath
初始化Hexo目錄
hexo init
待命令執行完畢,你會發現你的目錄下多了好多文件。
如:_config.yml 、themes等,他們的主要作用如下:
- _config.yml ——是博客主要配置文件
- db.json——是博客數據庫
- node_modules——是NodeJS依賴模塊
- source——是博客內容以及其他頁面(page)存在的目錄,這個目錄裏面有個_post目錄就是我們存放博客內容的地方,也就是存放博客內容markdown文檔地方,輸入hexo new “newPage”就會在這個目錄建立一個名爲newPage的子目錄,然後在裏面放入md文檔,並在主題的配置文件裏面添加相應欄目newPage,這樣就會顯示在主頁面的目錄上。(將在後續有所mark)
- themes——是主題存放文件
生成靜態頁面:
hexo generate 或 hexo g
現在你的博客已經可以在本地預覽了:
hexo server 或 hexo s
你會看到一個發光的地球,
至此,初始化完畢。
部署到GitHub
現在我們要將博客部署到GitHub上了。
打開我們上面提到的_config.yml,拉到最下面,會看到這樣的字樣:
deploy:
type:
把他改成如下這樣(示例):
deploy:
type: git
repo: https://github.com/你的GitHub賬號/你的項目名稱.git
branch: master
- type:如果你是Hexo3.0以上的版本,就寫git就OK,如果是3.0之前的版本,要寫成github。這是我聽說的。
至此,你的本地博客文件從某種意義上來講已經和Git關聯了,你需要做的就是提交了。
執行命令:
npm install hexo-deployer-git --save
字面上意思貌似又安裝了一個hexo-deployer-git,應該是可以讓Hexo支持提交到git的操作。我也不知道……
待執行完畢,接着執行下面的命令:
hexo deploy
將項目部署到GitHub。
訪問:https://你的GitHub賬號.github.io/ 就可以和那個發光的地球重逢了。
至此,部署完畢。
下一節我們將繼續講解如何管理你的博客,在那裏你可以知道如何更換自己想要的博客主題。
這裏比較重要的命令:
1. hexo clean 或 hexo c
2. hexo generate 或 hexo g
3. hexo deploy 或 d
- 清理一下hexo項目。
- 生成靜態頁面
- 部署Hexo項目
在提交博客或更改主題的時候會用到這些命令。
總結
說來你們可能不信,這破玩意兒我搗鼓了一天……知道爲什麼?因爲我至少看到了N種配置方法,然後我把這N種配置方法融會貫通,取之精華,棄之拖沓。含淚寫了這麼一篇博客。
希望你們看完能少走彎路,希望我不會成爲你們的彎路……