上一篇文章 阿里云虛擬機(jī)下搭建Typecho溉仑、WordPress博客 簡單的記錄了Typecho、WordPress下搭建個人博客過程榄审，今天這篇文章記錄下Hexo搭建個人博客的過程巾遭，對于此平臺的介紹分析個人博客搭建前期工作這篇文章也有說道若河。
配置 Git
- 安裝 Git：下載安裝后幅狮，注冊
GitHub賬號并配置Git - 創(chuàng)建 GitHub Repository：Repository 名字必須是
你的 GitHub 名.GitHub.io
配置 SSH
打開終端 募强，輸入cd ~/.ssh，如果果提示：No such file or directory說明未配置 SSH
- 本地生成密鑰對
ssh-keygen -t rsa -C "你的郵件地址"崇摄，注意命令中的大小寫不要搞混擎值。按提示指定保存文件夾，不設(shè)置密碼逐抑。 - 添加公鑰到 GitHub
- 根據(jù)上一步的提示鸠儿，找到公鑰文件（默認(rèn)為
id_rsa.pub），用記事本打開厕氨，全選并復(fù)制进每。 - 登錄 GitHub，右上角 頭像 —>
Settings—>SSH keys and GPG keys—>New SSK key腐巢。把公鑰粘貼到 Key 中品追，任意填好 Title 并點擊Add SSH key玄括。 - 終端中輸入命令
ssh -T git@github.com冯丙，選yes，等待片刻可看到成功提示。 - 修改本地的
ssh remote url胃惜，不用 HTTPS 協(xié)議泞莉，改用 Git 協(xié)議 - GitHub 倉庫中獲取 ssh 協(xié)議相應(yīng)的 url
- 本地倉庫執(zhí)行命令
git remote set-url origin "你的倉庫的url"，配置完后可用git remote -v查看結(jié)果
配置 hexo
- 安裝 Node.js
- 安裝 Hexo：
npm install hexo-deployer-git --save船殉，可用hexo -v查看版本
可能安裝過程并不是那么順利鲫趁，這個時候就需要到代理來安裝： - 清除代理：
npm config delete http-proxy和npm config delete https-proxy - 指向國內(nèi)鏡像源：
npm config set registry http://registry.cnpmjs.org/ - 創(chuàng)建 Hexo 文件夾：新建放置博客的文件夾，進(jìn)入并執(zhí)行命令
hexo init利虫。hexo 會在目標(biāo)文件夾建立網(wǎng)站所需要的所有文件 - 安裝依賴包：
npm install - 部署：打開博客根目錄下的
_config.yml文件挨厚，修改配置: 官方配置文檔
把Hexo部署到 GitHub
- 生成靜態(tài)頁面執(zhí)行命令：
hexo generate或hexo g - 啟動本地服務(wù)器執(zhí)行命令：
hexo server或hexo s在瀏覽器中打開http://localhost:4000/，如果打開正常執(zhí)行下一步糠惫。 - 部署網(wǎng)站執(zhí)行命令：
hexo deploy或hexo d
在瀏覽器中打開iOSWynter.github.io預(yù)覽效果疫剃，反正我是打不開。
綁定域名
- 向你的 Github Pages 倉庫添加一個CNAME文件
- 寫入域名如：
wynter.wang - 注意不要帶
www - 執(zhí)行
hexo d -g - 向DNS中添加三條記錄
@ A 192.30.252.153
@ A 192.30.252.154
www CNAME username.github.io
- 等待 DNS 配置生效（10分鐘左右）
- 通過在瀏覽器中輸入域名訪問網(wǎng)站
配置HTTPS
為了使網(wǎng)站更全最好的方法就是使用HTTPS硼讽，使用HTTPS后也會讓人感覺網(wǎng)站更專業(yè)點巢价，瞬間提升逼格。我們這里選用第三方免費的證書來給自己的網(wǎng)站做HTTPS固阁。推薦使用CloudFlare 和 Netlify 這兩個平臺都提供了免費SSL證書壤躲，兩者使用同樣簡單，但是 Netlify 創(chuàng)建成功后會關(guān)聯(lián)到你的github中XXXX.github.io的項目备燃，以后每次 GitHub 的 push 操作都會自動觸發(fā) Netlify 重新編譯部署碉克，而且還會生成一個xxx.netlify.com的二級域名，同樣也支持HTTPS赚爵。
CloudFlare 配置：
1棉胀、
Add a website填寫域名如：xxx.com，檢測DNS記錄值
2冀膝、根據(jù)提示設(shè)置CloudFlare站點IP解析（等待10分鐘左右）
3唁奢、選擇CloudFlare免費加速Free Website方案
Netlify 配置：
1、登陸Netlify入
XXXX.github.io項目
2窝剖、設(shè)置Name和Domain
3麻掸、根據(jù)提示設(shè)置CloudFlare站點IP解析（等待10分鐘左右）
4、在官網(wǎng)菜單中選擇HTTPS點擊Let’s Encrypt開啟HTTPS
解決多說功能失效
在配置完HTTPS后發(fā)現(xiàn)多說的評論和分享功能失效赐纱，然后使用瀏覽器的審查脊奋，發(fā)現(xiàn)是由于多說資源網(wǎng)址并不支持HTTPS導(dǎo)致，強(qiáng)制使用https://static.duoshuo.com/embed.js無法獲取embed.js文件疙描，那么問題就找到了诚隙，解決辦法如下：
1、在瀏覽器中輸入
http://static.duoshuo.com/embed.js起胰，然后command+s選擇頁面源碼點擊儲存
2、將儲存的embed.js文件，放到~/hexo/themes/next/source/js/的目錄下
3地消、打開~/hexo/themes/next/layout/_scripts/third-party/comments/目錄下的duoshuo.swig,將ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js';替換為ds.src = '/js/embed.js';
附加Hexo常用命令
| 命令 | 介紹 | 簡寫 |
|---|---|---|
hexo init [folder] |
新建一個網(wǎng)站炉峰。如果沒有設(shè)置 folder脉执，Hexo 默認(rèn)在目前的文件夾建立網(wǎng)站 |
無 |
hexo new [layout] 'title' |
新建一篇文章疼阔。如果沒有設(shè)置 layout 的話巫橄，默認(rèn)使用 _config.yml 中的default_layout 參數(shù)代替嗦随。如果標(biāo)題包含空格的話列荔，請使用引號括起來 |
hexo n 'title' |
hexo new page 'title' |
新建頁面 | 無 |
hexo generate |
生成靜態(tài)文件 | hexo g |
hexo publish 'title' |
發(fā)表草稿 | hexo p |
hexo server |
啟動服務(wù)器贴浙。默認(rèn)情況下，訪問網(wǎng)址為： http://localhost:4000/ | hexo s |
hexo deploy |
部署網(wǎng)站 | hexo d |
hexo clean |
清除緩存文件 (db.json) 和已生成的靜態(tài)文件 (public) | hexo c |
hexo deploy -generate |
生成靜態(tài)頁面并部署 | hexo d -g |
總結(jié)
hexo搭建博客并不是這么簡單署恍，也是美美的折騰了一波搭建成功的崎溃，讓我先去哭會。
