Hexo 实战（一）：搭建开源博客系统 Hexo 并将其部署到 GitHub
Hexo 是使用 Node.js 技术实现的静态博客框架，依赖很少，安装超级简单，可以将 markdown 文件生成博客文章，而
且可以将生成的静态内容发布到 Github 上。
本次使用的操作系统是 Windows，在 Linux 上操作类似。
环境准备
安装 git
下载地址：
https://git-scm.com/download/win
本次下载安装的文件是【Git-2.22.0-64-bit.exe】。
安装完成后在命令窗口输入命令 git –version 验证是否安装成功，如下能输出 git 版本说明安装成功：
C:UsersAdministrator>git --version
git version 2.22.0.windows.1
在鼠标右键也会有 git 操作的显示：
安装 Node.js
下载地址：
https://nodejs.org/en/download/
本次下载安装的文件是【node-v12.16.1-x64.msi】。
安装完成后在命令窗口输入命令 node -v 验证是否安装成功，如下能输出 node 版本说明安装成功：
C:UsersAdministrator>node -v
v12.16.1
安装 Hexo
使用命令 npm install -g hexo-cli 安装 Hexo。
使用命令 hexo init blog 初始化博客：
如上已初始化完成，目录结构如下：
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
- _config.yml：网站配置信息文件
- package.json：应用程序的信息
- scaffolds：目标目录
- source：存放用户资源的目录，除 _posts 文件夹之外，开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。
- themes：主题目录，hexo 会根据主题来生成静态页面
hexo 基本使用
进入 blog 文件夹，使用命令 hexo server （可简写 hexo s）启动服务：
如上 hexo 博客系统服务已启动完成，浏览器输入地址 http://localhost:4000 访问：
系统默认新建了一个 Hello World 博文，实则这个博客就是目录【source/_posts】中文件为【hello-world.md】的内容，使用命令 hexo new “Hello by hexo newcommand” 则会在该目录中新增一个文件【
Hello-by-hexo-new-command.md】：
C:SpecialTestHexoTestlog>hexo new "Hello by hexo new command"
INFO Created: C:SpecialTestHexoTestlogsource\_postsHello-by-hexo-new-command.md
就会在博客系统中产生一篇名为【Hello by hexo newcommand】的博文：
直接在目录中【source/_posts】拷贝过来一个文件，如【frp.2020032301.md】，Hexo 检测到有文件就会在博客系统中生成一篇博文与文件名一样的博文，如：
如果是多层目录，也会对应生成多层路径如：
结合 GitHub 使用
GitHub 创建个人仓库
登录 GitHub ,新建仓库（New repository）,在 Repository name 输入【你的用户名.github.io】，这样配置在后面部署到 GitHub 时就能被失败，如：
Git 与 GitHub 帐号绑定
- 配置 git 全局的的用户名和邮箱
将 git 全局的的用户名和邮箱配置成 GitHub：
使用命令 git config –global user.name “你的GitHub用户名” 配置 git 全局的的用户名。使用命令 git config –global user.email “你的GitHub使用的邮箱” 配置 git 全局的的邮箱。
范例如下：
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 ~
$ git config --global user.name "kungge"
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 ~
$ git config --global user.email "kunggewan@hotmail.com"
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 ~
$ git config user.name
kungge
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 ~
$ git config user.email
kunggewan@hotmail.com
- 生成密钥
使用命令 ssh-keygen -t rsa -C “kunggewan@hotmail.com” 后一直回车即可，范例如下：
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 ~
$ ssh-keygen -t rsa -C "kunggewan@hotmail.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/Administrator/.ssh/id_rsa):
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
Your identification has been saved in /c/Users/Administrator/.ssh/id_rsa.
Your public key has been saved in /c/Users/Administrator/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:97THjWf3vbYf4BpwOfUra/sz/Sr0gk8SFNEU9RotcM0 kunggewan@hotmail.com
The key's randomart image is:
+---[RSA 3072]----+
| o++ooo |
| ..o oE|
| . .o o|
| . o .+ |
| S.o+.... |
| .o++o.o.|
| .++++o*|
| .o=o+**|
| oo===%|
+----[SHA256]-----+
这样就在目录【C:Users你的用户名.ssh】中生成密钥，如【C:UsersAdministrator.ssh】中：
- 将生成的密钥更新到 GitHub 上
打开 GitHub settings 下的 【SSH and GPG keys】，然后添加 SSH Key，Title 自取，Key 的内容为上面生成的文件【id_rsa.pub】的内容：
点击【Add SSH Key】后会在列表中显示新增的 SSH Key，如：
- 验证是否成功
使用命令 ssh -T git@github.com：
Administrator@ecs-x-large-2-win-20200316202505 MINGW64 /c/Special/Test/HexoTest/blog
$ ssh -T git@github.com
The authenticity of host 'github.com (52.74.223.119)' can't be established.
RSA key fingerprint is SHA256:nThbg6kXUpJWGl7E1IGOCsp***TxdCARLviKw6E5SY8.
Are you sure you want to continue connecting (yes/no/[fingerprint])? yes
Warning: Permanently added 'github.com,52.74.223.119' (RSA) to the list of known hosts.
Hi kungge! You've successfully authenticated, but GitHub does not provide shell access.
将 Hexo 部署到 GitHub
打开配置文件【_config.yml】，将 deploy 节点下内容修改如下：
deploy:
type: git
repo: https://github.com/kungge/kungge.github.io.git
branch: master
repo 为你上面创建的项目仓库地址。
安装 git 部署插件：
C:SpecialTestHexoTestlog>npm install hexo-deployer-git --save
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.1.2 (node_modulesfsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ hexo-deployer-git@2.1.0
added 1 package from 1 contributor and audited 570 packages in 3.271s
5 packages are looking for funding
run `npm fund` for details
found 2 low severity vulnerabilities
run `npm audit fix` to fix them, or `npm audit` for details
然后分别执行如下命令：
- hexo clean：清除
- hexo generate，可简写成 hexo g：生成静态内容
- hexo deploy，可简写成 hexo d：部署文章
也可以组合使用 hexo cl && hexo g && hexo d。
执行部署命令 hexo deploy 时，会要求输入 GitHub 的用户名和密码：
登录确认，如果出现如下则表明部署成功：
注：如果失败可参考【P.3 部署到 GitHub 失败】解决。
如下已部署到 GitHub 成功：
查看 GitHub 仓库代码可看到静态页面已经发布过来了：
绑定域名
域名解析设置
进入域名控制台，本次使用的华为云，添加记录集，主机记录，如果是主域名，则使用 www，如果是二级域名则使用二级域名名称，如 blog，类型选择 CNAME，值就是你的 github 博客网站项目地址，如 kungge.github.com：
这个时候如果直接访问你的域名还是会404报错：
github 设置
进入你的项目，点击 Settings 进入设置页面：
在 GitHub Pages 一栏中找到 Custom domain 然后在文本框中输入你的域名，点击 save 即可：
实则这个时候就可以通过访问域名来访问网站了。
本地博客设置
在本地博客的 blog/source 目录中，创建一个记事本，内容输入你的域名，如本次为 blog.kungge.com，保存为 CNAME 文件名称，不要带后缀。
然后使用如下三个命令来重新生成内容并部署到 Github。
常见问题
安装 hexo 出错
使用命令 npm install -g hexo-cli 后，再使用的时候报 git 不是内部或外部命令：
解决办法：重新删除目录重来。
图片解析不出来
可以将图片放置在目录【source】，这样图片就能显示出来：
但是这样肯定不行，当图片不哦多时则会占据大量的存储空间，文章加载时候会变慢，而且md文件过多图片过多，这个目录就会变得很大，难于维护。
可以使用图床解决这个问题，图片存储在云存储中，如阿里云存储、又拍云存储等第三方的文件存储服务，使用图片链接地址即可，如在 markdown 中就可以这样使用：
部署到 GitHub 失败
使用命令 hexo d 部署如出现访问git地址失败，如：
解决：重新使用命令 hexo d 则会在命令窗口要求输入 github 的用户和密码，回车即可：
© 版权声明
文章版权归作者所有，未经允许请勿转载。
相关文章
暂无评论...
