Hexo 博客搭建教程（二）
續(xù)上一篇：《Hexo 博客搭建教程》
2. 本地搭建Hexo項目
Hexo 是一個博客框架，項目語法是 Markdown，當然你也可以配置其他。
安裝 Hexo
1. 環(huán)境準備
基礎環(huán)境配置完善 (詳見基礎物料) 可以輸入一下命令進行環(huán)境 check 是否安裝成功。
git --version
node -v
npm -v
2. 安裝
npm install -g hexo-cli3. 初始化博客項目
執(zhí)行一下命令
hexo init xxx.github.io
cd xxx.github.io
項目結構如下：
hiciciya.github.io├── db.json├── node_modules // 依賴├── package.json // 應用程序信息├── scaffolds //模板文件夾│ ├── draft.md│ ├── page.md│ └── post.md├── source // 資源文件夾│ └── _posts├── themes //主題 博客風格├── _config.landscape.yml└── _config.yml //網站配置信息
4. 本地運行項目
npm run server
or
hexo -s
項目本地就運行起來了！it'S WORK。
我們看到首頁默認有一篇 HelloWord 的文章。我們來思考如何去控制這篇文章，在已生成目錄中去找與 Helloword 內容相匹配的文件，發(fā)現(xiàn) /source/_posts/HelloWord 與我們看到的文章內容匹配。
├── source│ └── _posts
5. 嘗試修改初始化的文章內容
---title: 我的第一篇文章---
頁面中文章名稱跟著變化生效了。
得出的結論就是 /source/_posts 下的 md 控制文章視圖。
6. 新建文章
執(zhí)行 hexo new MyWord
順著我們剛才的邏輯 /source/_posts 應該增加一個 名為 MyWord.md 的文件。
這樣一篇文章就新建成功了！編輯文章內容，在 MyWord.md 可以隨便來點內容。
---title: MyWorddate: 2021-06-03 13:49:16tags:---### 我的世界很簡單 簡單到我每頓只吃大龍蝦
頁面同步更新哈
恭喜第一篇博文發(fā)表成功！但是此刻僅是在本地哈。
3. 部署 Githubpages
部署思路
本地代碼變化
同步到遠端倉庫
客戶端同步更新
能自動化實現(xiàn)該流程是理想狀態(tài)，持續(xù)集成（CI）工具則是最優(yōu)解。Hexo 官方推薦 Travis。
開始部署
1. Travis與github關聯(lián)
點擊 https://www.travis-ci.com/ 進入 Travis 官網，右上角點擊`Sign in`按鈕。
進入 登錄界面，點擊 SIGN IN WITH GITHUB 按鈕。
登錄成功！
2. Github 配置 Travis CI 權限
點擊當前頁按鈕 Activate all repositories using GitHub Apps
進入授權頁面，點擊 Approve Install
初次關聯(lián)的話，會重定向一些頁面。如果有需要就選擇綠色按鈕，綠色代表同意，完成授權。
3. 新建 Personal Access Token
點擊 github.com/settings/to… 點擊 Generate new token
鍵入 Token 名稱，在 Note 項填入 GH_TOKEN 并只勾選 repo 的權限。
左下角 Generate token Token 生成成功，復制新生成的 Token，如下圖所示：
4. Travis CI 配置 Environment Variables 對應的項目倉庫配置環(huán)境變量
回到 Travis CI 主頁，右側選擇選項目倉庫，點擊右上角 More options 下拉選擇Settings，滾動至 Environment Variables。
新建環(huán)境變量 Name 為 GH_Token VALUE，作為我們在 GitHub 生成的 Token。
ps：請確保 DISPLAY VALUE IN BUILD LOG 不被勾選，避免你的 Token 被泄漏。
項目配置CI
1. 新建一個 .travis.yml
復制以下內容至 .travis.yml 文件
2. 提交本地代碼至遠端
git add .
git commit -m "add travis config"
git push origin master
Travis CI 應該會自動開始運行，并將生成的文件推送到同一 repository 下的 gh-pages 分支下。
回到 Travis CI 官網，如下圖所示，完成部署。
3. 修改 GithubPages 部署分支
回到 Github 對應項目主頁，點擊 Settings。
右側側邊欄選擇 Pages Source，選擇分支為 gh-pages（默認部署為 master 分支) 點擊 Save。
4. 瀏覽器 訪問 xxxx.github.io
沒有成功？？？我原本也是這樣認為的，各種百度，吸取百家之長后，原來此時只是需要等 10 分鐘或者 20 分鐘。
穩(wěn)住！！！
done!!!
推薦閱讀：
恭喜你又在前端道路上進步了一點點。
點個“在看”和“贊”吧！