Hello Hexo & Travis !

静态网站生成器

GitHub static-site-generator 主题下 Node.JS 架构 star 前三的项目中,Hexo 生态最完善:

  1. 包括中文在内的多语言官网

  2. 使用文档不但每页开篇有视频讲解,简体中文视频直接托管在 Bilibili

  3. 插件、主题的搜索引擎更是方便,接地气的国人作品也很多

官网一番学习之后,发现起步比较简单:

npm install hexo --global

hexo init my_pages

git init
git checkout --orphan hexo

随后又在官网搜了一个简洁、美观、强大、易用的主题模板 Matery

持续集成、持续部署

最后一顿 Google,入门了近几年开源界最流行的 Travis CI,它的配置文件 .travis.yml 看起来像 Dockerfile,但更自然:

branches:
  only:
    - hexo

language: node_js
node_js:
  - lts/*
cache:
  directories:
    - node_modules

install:
  - npm install
script:
  - npm run build
  - cd ${FOLDER}
  - git init
  - git config user.name ${UID}
  - git config user.email ${EMAIL}
  - git add .
  - git commit -m "${MESSAGE}"
  - git push --force --quiet https://${TOKEN}@${GIT_URI}.git master:${BRANCH}

上述命令行脚本中的环境变量可在 Travis CI 项目配置页设置,示例如下:

变量名 示例值 释义 备注
FOLDER public 网页生成器的输出目录
UID yourID Git 用户名 Travis 自动设置
EMAIL [email protected] Git 电邮地址
TOKEN Git 平台个人访问令牌 https://github.com/settings/tokens/new
GIT_URI github.com/yourID/yourID.github.io Git 仓库标识符 嫌 GitHub 访问慢也可用 Coding.net、码云
BRANCH master GitHub Pages 目标分支
MESSAGE :memo: Update HTML by Travis CI Git 提交注记

新版个人网站初步落成!~

开源项目 API 文档生成

既然 Travis CI 配置脚本可以用环境变量变得灵活,那基于 JSDoc、ESDoc 之类的开源项目生成 API 文档站也可照搬以上方法了:

  • 再也不用在本地 Git precommit 钩子上执行文档生成脚本了,加快提交速度

  • 把生成的文档放在独立的 gh-pages 分支,让 master 分支只放源码,提交记录更清爽

  • git push --force 也让文档站分支不保留不必要的提交记录,仓库体积最小化

但是,Travis 的 Windows 环境尚处测试阶段,我实测时出现“失败但无报错详情”的 bug,只好让 Puppeteer-IE 改用 Azure Pipeline

trigger:
- master

pool:
  vmImage: 'vs2017-win2016'

steps:
- task: [email protected]
  inputs:
    versionSpec: '8.x'
  displayName: 'Install Node.js'

- bash: |
    npm install
    npm run build
    cd ${DOC_FOLDER}
    git init
    git config user.name ${GIT_USER}
    git config user.email ${GIT_EMAIL}
    git add .
    git commit -m "${GIT_MESSAGE}"
    git push --force --quiet https://${GIT_TOKEN}@${GIT_URI}.git master:${GIT_BRANCH}
  displayName: 'npm install & build Document'

再次领略 微软文档的一大特点 —— 要么一笔带过、不知所云,要么又臭又长、不明重点…… 好歹有个项目配置模板,连蒙带猜改一改,竟然能用…… 也算是不枉费我秋天跑一趟上海~

参考资料

  1. https://segmentfault.com/a/1190000013058880

  2. https://ssk7833.github.io/blog/2016/01/21/using-TravisCI-to-deploy-on-GitHub-pages/

  3. https://easyhexo.github.io/Easy-Hexo/

  4. https://docs.microsoft.com/en-us/azure/devops/pipelines/yaml-schema?view=vsts&tabs=example#bash


转载请注明: TechQuery Hello Hexo & Travis !

上一篇
JavaScript 一句话总结 JavaScript 一句话总结
JavaScript 是一门原生支持函数式编程范式的、基于原型的面向对象语言,也是一门弱类型动态脚本语言 What’s this ? JavaScript 函数的 this 是由函数调用者在调用前确定的 —— 继承自 LISP 语言
2019-01-23
下一篇
滑雪与武术 滑雪与武术
一匹来自北方的狼,在西南腹地的雪山上学会了滑雪…… 😂 笨手笨脚看着别人半蹲着顺着坡度轻松滑直线,我同样的姿势,脚下的滑雪板却随着前人滑过的轨迹乱抖,很快就歪到一边,不是摔倒就是 180° 转向,倒着滑下去比正着溜…… 还不如同行的小个子
2019-01-23