Hexo+Coding部落格的安裝和使用
之前一直在CSDN上面寫部落格,思慮了很久,終於還是忍不住想自己搭建一個部落格。想過使用 wordpress,需要找一個免費的主機確實又是個麻煩事。所以靜態部落格會是個好的選擇。
自己瞭解到的靜態部落格有 jekyll 和 octopress、hexo,jekyll 和 octopress 是基於 ruby 開發的,說實話又要來學一門新語言,我是不太願意的。hexo 是基於 nodejs 的,而 nodejs 又號稱是前端工程師的歸宿。加之傳聞 hexo 的部落格生成速度比 jekyll 快了一個數量級。So,毫無疑問就是 hexo 了。
一、安裝 nodejs
既然是基於 nodejs 的,那第一步毫無疑問就是先安裝 nodejs 了。來到 nodejs 的官網
二、安裝 git
為什麼要安裝 git 呢?客觀的原因也沒有深究。且來說說主觀原因吧。
1. git-bash 提供大部分的 linux 命令,差不多就是你在 windows 下通過 git-bash 就能享受 linux 命令的快感了。
2. git 本身是一個檔案版本管理器,有聽過 github 可能會比較清楚。總之,作為一個程式設計師, Just learn it。
3. Github 提供一個 Pages 服務,可以讓使用者免費掛載靜態程式碼在上面執行,這對於前端工程師來說是個莫大的幸運了。不用管理麻煩的伺服器,又可以享受伺服器部署的待遇。但是很不巧的,國內的
三、安裝 hexo
終於要進入正題了。
首先開啟 git-bash,進入到一個合適的存放 hexo 部落格的目錄,直接執行
npm install -g hexo-cli
至此 hexo 就安裝好了,就是這麼簡單了。但是彆著急,這只是個 hexo 的程式,部落格還沒開始搭建呢。
四、搭建部落格
安裝完 hexo 之後,還要執行下面三條命令
hexo init <folder>
cd <folder>
npm install
這樣就把預設主題的 hexo 部落格安裝好了,這時候再執行
hexo server // 或者 hexo s
就能夠建立起一個本地的伺服器,埠是4000,開啟瀏覽器 http://localhost:4000 就能訪問屬於你自己的部落格了。
五、切換主題
hexo 官方提供了大量的優秀主題可以更換,當然也可以選擇自己去寫一個主題出來。
我在官網看到一個 Next 主題,甚是喜歡,毫不猶豫就把主題給換了。
1. 主題程式碼拷貝
主題的拷貝也是直接使用 git 即可,首先進入到你部落格的根目錄,再開啟 git-bash 執行
git clone https://github.com/iissnan/hexo-theme-next themes/next
- 啟用主題
在部落格根目錄下找到_config.yml
檔案,找到裡面的 theme,改為
theme: next
這時再執行一次 hexo s
,看看主題有沒有生效吧。
六、釋出部落格到 coding
1. 配置hexo deploy
hexo 提供了一個部署命令 hexo deploy
,首先需要安裝一下 hexo-deployer-git
外掛
npm install hexo-deployer-git --save
然後配置一下_config.yml
檔案:
deploy:
type: git
repo: <repository url>
branch: [branch]
message: [message]
引數 | 描述 |
---|---|
repo | 庫(Repository)地址 |
branch | 分支名稱。如果您使用的是 GitHub 或 GitCafe 的話,程式會嘗試自動檢測。 coding 建立我們填的是 coding-pages |
message | 自定義提交資訊 (預設為 Site updated: {{ now('YYYY-MM-DD HH:mm:ss') }}) |
2. 預覽效果
在 coding 上建立一個私人倉庫,找到程式碼的 coding 地址,填好上面的配置,然後直接執行
hexo deploy
不出意外的話會讓你填寫 coding 的使用者名稱和密碼完成上傳操作。如果你有配置 ssh 方式的話就更加方便了。
這個時候再到 coding 對應的專案裡面開啟 pages 服務,根據 coding 建議,因為不是 jekyll 專案,所以需要再新建一個.nojekyll 檔案(空檔案就行,其實不建立也行),等上一會就能夠訪問自己的部落格了。