用GitHub Pages搭建个人Blog，非常简单实用。主要有以下3个关键步骤

  • 搭建开发环境
  • 新建GitHub Repo
  • Hexo框架

搭建开发环境

  • 安装Node.js，Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时。安装完Node.js后，npm也就安装上了，npm是包含在node.js里面的一个包管理工具，就像Linux中的yum，rpm包管理；python中的pip包管理工具一样，这会经常npm的命令。
  • 安装TortoiseGit，安装其他的也可以Git，SourceTree等
  • 安装Vistual Studio Code或其他IDE

创建GitHub仓库

  • 登录GitHub（如果没账号，请注册）。
  • 新建一个 你GitHub用户名.github.io 仓库，那么搭建成功后，你的网站访问地址就是 http://你GitHub用户名.github.io了。这样的话，可以免费使用了，如果想绑定其他域名的话，可以去阿里等运营商购买，关于DNS，https配置csdn上都有相关文章可以参考。

注意，这里创建的GitHub仓库不是放hexo代码的，而是放hexo generate命令之后的public文件的

Hexo框架

hexo是快速、简洁且高效的博客框架，有超快速度渲染，支持Markdown，一键部署，插件和可扩展性等。

  • 安装hexo，
1
$ npm install -g hexo
  • 新建一个文件夹，在文件夹里，右键使用VS Code打开。在VS Code的菜单的Terminal，点击新建Terminal后，在Terminal运行
1
$ hexo init

命令，成功后会在这个文件夹出现hexo初始文件。

  • 生成和本地预览
1
2
$ hexo generate #生成静态页面至public目录
$ hexo server #开启预览访问端口（默认端口4000，'ctrl + c'关闭server）
  • 发布前，一般可能要安装
1
$ npm install --save hexo-deployer-git

然后修改根目录下的*_config.yml*，如下：

1
2
3
4
deploy:
  type: git
  repo: https://github.com/bet2019/bet2019.GitHub.io.git
  branch: master

  • hexo基本命令
    hexo new “pageName”
    hexo generate #生成静态页面至public目录
    hexo server #开启预览访问端口（默认端口4000，'ctrl + c’关闭server）
    hexo deploy #部署到GitHub
    更多命令

  • 关于主题样式，更多主题

sitemap

1
2
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

_config.yml中，添加

1
2
3
# 自动生成sitemap
sitemap:
path: sitemap.xml
1
npm install hexo-abbrlink --save

建议在_config.yml中类似这样的配置，不然可能会有图片不显示等问题。

1
2
3
4
permalink: posts/:abbrlink/
abbrlink:
  alg: crc32  # 算法
  rep: hex    # 进制

最后，写Blog熟悉Markdown的语法，会写出样式更丰富的Blog。