搭建基于GitHub Pages和HEXO的个人博客的详细步骤

0 我的搭建思路是联合HEXO和GitHub Pages完成个人博客搭建。

1 GitHub平台的在线准备。
1.1 注册GitHub账号,不要开二次验证,就是邮箱+密码登陆的安全模式。此处会设置一个用户名,下面行文中全部表述为GITHUBUSERNAME;绑定一个邮箱,下面行文中全部表述为GITHUBEMAIL。
1.2 在GitHub账号中创建Repositories(绿色按钮,New Repositories或者Create Repositories),Repositories必须命名为GITHUSERNAME.github.io,不可命名为其他!
1.3 然后点击Repositories的设置(一个齿轮图标),下拉菜单,找到GitHub Pages,Source下Branch选择main(此处是可以选择master的,GitHub的默认是main;如果选择master,第4.4步骤的yml文件需要对应更改),挂载点为/(root),点击Save保存。Theme Chooser下点击Choose a theme,选择默认的第一个(这里的theme主题最终会被替换,此处只是搭建一个空平台而已)。
1.4 新开一个浏览器选项卡访问https://GITHUSERNAME.github.io和https://github.com/GITHUSERNAME/GITHUSERNAME.github.io。如果访问出错请检查GitHub平台的在线准备的操作。

2 本地开发环境搭建
2.1 我的操作平台是Windows平台,系统版本为21H1(内部版本19043.1348),硬件为Surface Go 1。在完成下面操作之前需要先安装Node.js和Git。
2.2 Node.js下载地址为https://nodejs.org/en/download/,根据实际系统情况安装(我选择的是node-v16.13.0-x64.msi),安装过程不需要改动任何东西,全部下一步到完成即可。
2.3 Git的下载地址为https://git-scm.com/downloads/,根据实际系统情况安装(我选择的是Git-2.34.0-64-bit),安装过程不需要改动任何东西,全部下一步到完成即可。(如果有不喜欢Git自带命令行工具的可以在Configuring the terminal emulator to use with Git Bash(确定配合Git命令行模式所用的终端模拟器)一步改选Use Windows’ default console window(使用Windows自带的命令提示符)。)

3 本地博客工具安装
3.1 在一个没有中文字符的路径下新建英文名称文件夹作为博客本地镜像,在这个文件夹中鼠标右键单击选择Git Bash Here打开命令提示符。
3.2 添加大陆源 命令 npm config set registry https://registry.npm.taobao.org
3.3 安装HEXO 命令 npm i hexo-cli -g
3.4 查看HEXO版本(同时确定HEXO是否安装正确) 命令 hexo -v
3.5 重置HEXO初始化 命令 hexo init
3.6 完成HEXO附加文件的完整安装(其实就是生成一套hello world页面) 命令 hexo install
3.7 转换md为html静态页面(上一步的操作中会生成一个helloworld.md文件,以测试hexo平台) 命令 hexo g
3.8 开启本地服务器并在本地查看 命令 hexo s,代码跑完之后之后打开浏览器,访问localhost:4000,会打开一个默认的hexo页面,之后将命令提示符调整回当前活动窗口,按Ctrl+C结束本地服务器进程。但不要关闭命令提示符。

4 打通本地HEXO和GitHub平台连接
4.1 在上面的命令提示符中继续操作。
4.2 设置用户名 命令 git config –global user.name “GITHUBUSERNAME”
4.3 设置邮件地址 命令 git config –global user.email “GITHUBEMAIL”
4.4 修改本地yml文件,将本地博客文件夹中的_config.yml用记事本打开,在文件的最后一行输入并修改,使文件的最后三行为
type: git
repo: git@github.com:GITHUBUSERNAME/GITHUBUSERNAME.github.io.git
branch: main
需要注意的是每一行开头有两个空格,冒号后面有一个空格,行末没有其他字符。以及,如果在1.3处如果选择的Branch是master,最后一行的main需要对应改为master。
4.5 生成ssh密钥对 命令 ssh-keygen -t rsa -C “GITHUBEMAIL”,输入命令后提示设置保存密钥对名称,设置并确认私钥密码,均不输入,直接回车过去(修改密钥对名称会影响下一步命令;修改密码会影响本地HEXO和GitHub平台连接)。
4.6 导出并复制公钥 命令 cat ~/.ssh/id_rsa.pub,之后选中以ssh-rsa开头,以GITHUBEMAIL结尾的字符串。
4.7 在GitHub导入公钥,在GitHub右上角头像下拉菜单选Settings,左侧找到SSH and GPG keys,右侧SSH keys选择New SSH Key,名称随意(更推荐填写GITHUBUSERNAME.github.io),密钥框里将上一步的字符串粘贴进来。保存。
4.8 从命令提示符连接GitHub 命令 ssh -T git@github.com,这里的git@github.com不要改,出现Are you sure you want to continue connecting (yes/no/[fingerprint])?提示后敲键盘yes,回车,如果显示你的Hi GITHUBUSERNAME! You’ve successfully authenticated, but GitHub does not provide shell access.则表示连接成功。
4.9 输入命令 npm install –save hexo-deployer-git,回车,之后输入hexo d,第一次上传发布会弹出登陆窗口,用GITHUBEMAIL和密码登陆即可。如果输入hexo d后提示ERROR Deployer not found: git,之后再hexo d。
4.10 等2-5分钟后打开GITHUBUSERNAME.github.io,可以发现GitHub上的网站已经和本地同步。

5 从WordPress导入
5.1 安装迁移插件 命令 npm install hexo-migrator-wordpress –save
5.2 从WordPress导出博客,在仪表板-工具-导出,得到的文件表述为WP.XML。
5.3 从WP.XML导入博客 命令 hexo migrate wordpress WP.XML,此处需要饱含WP.XML的路径,可以输入命令主题后将文件拖入命令提示符。

6 绑定独立域名
6.1 在本地博客文件夹下找到source,在此文件夹内新建文本文档,内容为绑定的域名,不包括http://或者https://,包括二级域名。然后修改文本文档名称为CNAME,没有扩展名。
6.2 使用hexo d命令更新在线博客
6.3 在1.3所涉及的页面(https://github.com/GITHUSERNAME/GITHUSERNAME.github.io/settings),在GitHub Pages部分的Custom domain输入绑定的域名,此处的域名需要和6.1步骤CNAME中的域名完全一致。
6.4 在域名商的解析页面修改DNS,使用CNAME指向GITHUSERNAME.github.io。

Q.E.D.