Hexo博客环境搭建

发表于 更新于 分类于 ， 阅读次数： 本文字数： 3k 阅读时长 ≈ 3 分钟

本文介绍在Linux、Windows完成Hexo博客的搭建，包括安装和配置Hexo，将博客部署到github，使得可以通过github page的方式进行访问博客

系统环境

本系列文章所有操作在系统Linux Mint 20 Cinnamon及windows上完成，其他关联应用为：

1
2
3
4
node
npm
hexo
git

安装Hexo

安装nodejs

Hexo是基于nodeJS编写的，所以需要安装nodeJs，npm是nodejs的包管理工具，新版本的nodejs包含该工具，不需要单独安装

Linux安装

1
2
sudo apt install nodejs
sudo apt install git

Windows安装

  1. 安装 nodejs: 从 Node.js 下载 nodejs 的 msi 安装文件，双击默认选项安装
  2. 安装git:从Git - Downloading Package下载git的exe安装文件，双击默认选项安装

配置npm镜像[1][2]

npm是nodeJs的包管理工具，用于从NPM服务器下载第三方包到本地使用或上传自己编写的包，但是国内直接使用npm的官方镜像往往较慢，因此建议使用淘宝镜像，可以通过两种方式达到这个目地：

  • 更改npm的默认镜像
1
2
3
4
5
6
7
8
#查看当前镜像地址
npm get registry

#设置为淘宝镜像
npm config set registry http://registry.npm.taobao.org/

#还原为原始配置
npm config set registry https://registry.npmjs.org/
  • 安装淘宝定制的cnpm工具
1
2
3
4
5
# 安装cnpm工具
npm install -g cnpm --registry=https://registry.npm.taobao.org

#使用cnpm工具
cnpm install [name]

博客初始化

安装hexo

通过npm工具安装hexo，使用命令

1
npm install -g hexo

博客初始化

使用hexo初始化博客，初始化文件夹为空或不存在

1
2
#初始化+安装npm
hexo init myblog;cd myblog;sudo npm install

安装完成后，得到以下文件结构

测试博客

在新建的博客目录下，使用以下命令测试博客是否初始化完成

1
hexo server

浏览器打开：http://localhost:4000/后，得到以下页面，表面博客初始化成功

发布博客到Github Page

配置本地及github

为了将博客部署到github，需要在本地生成SSH key，并将公钥配置到github

本地生成公钥及密钥

使用以下命令，一直回车生成公钥和密钥

1
ssh-kengen -t rsa -C "yourmail"

生成之后的公钥及密钥保存在目录~/.ssh内，其中id_rsa为私钥，不可泄漏，id_rsa.pub为公钥，将配置到github上，上传代码时，公钥和私钥相互匹配，才能顺利上传代码。

公钥配置到github

登录github后，依次进入Settings->SSH and GPG keys，然后点击New SSH key，将公钥文件id_rsa.pub里面的内容全部填到Key上

测试是否配置成功

使用以下命令检查，配置是否成功

1
ssh -T git@github.com

安装部署插件

通过npm安装git插件，以便进行github部署

1
npm install hexo-deployer-git --save

新建github pages仓库

推送前需先新建一个用于存储博客的仓库，该仓库为用户的github page（GitHub Pages is a static site hosting service designed to host your personal, organization, or project pages directly from a GitHub repository）[3]，以下两个操作完成此步骤：

  1. 新建一个公开（Public）仓库，仓库名为你的用户名.github.io；
  2. 进入仓库的Settings，找到Github Page，在Source选择分支，并保存
  3. 浏览器访问https://[YourUserName].github.io/，成功访问即配置成功（这可能需要科学上网）

设置博客部署仓库

将远程仓库地址配置到博客配置文件中，部署时往此仓库推送，打开_config.yml文件，在最后找到Deployment配置项，按以下方式配置：

1
2
3
4
5
6
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  repo: https://github.com/[YourUserName]/[YourUserName].github.io.git
  branch: master

推送博客到github pages仓库

使用以下命令推送hexo博客到github page仓库上

1
hexo clean;hexo generate;hexo deploy

在浏览器上再次访问https://[YourUserName].github.io/，出现以下画面表示成功

绑定域名

每次访问博客，均需使用 https://[YourUserName].github.io/ 打开，本着装逼的原则，申请一个个人使用的域名，即可以便于记忆/宣传，又隐藏博客在 github page 的行为，代价是需要 RMB（一年 70）。

申请域名

我是在腾讯云申请的域名，阿里云也可以通过申请，访问：域名注册_免费智能DNS_域名交易_域名购买申请 - DNSPod - 腾讯云官网，搜索自己计划使用的域名，选择完成后付费，完成实名认证＋备案，即可使用。

完成域名申请后，需配置域名的解析地址，按照以下方式添加两个记录

image-20210218163454662

绑定域名

通过以下两个步骤完成域名的绑定

1.配置Hexo博客

在hexo/source目录下新建一个名为CNAME的文件，然后将申请的域名填写到里面

2.配置Github Pages

到仓库的Github Pages页面，在Custom domain配置申请的域名（注意：配置成功后不会立马生效）

image-20210218165026184

在浏览器上通过申请的域名访问博客，如果成功，则配置成功！！！

发文流程

使用以下命令新建一个博文，然后使用markdwn格式写博文，再然后部署到github pages上

1
hexo new "文件名.md"

遇到的问题

1.sudo npm install -g hexo遇到rollbackFailedOptional: verb npm-session[4]

原因：（1）网络原因；（2）未配置国内镜像服务器；

解决：配置npm使用淘宝镜像服务器

1
npm config set registry http://registry.npm.taobao.org

参考资料[5][6][7][8]：

  1. NPM 使用介绍 ↩︎

  2. npm的镜像替换成淘宝 ↩︎

  3. What is GitHub Pages? ↩︎

  4. npm install rollbackFailedOptional: verb npm-session ↩︎

  5. 使用hexo+github搭建免费个人博客详细教程 ↩︎

  6. 超详细Hexo+Github Page搭建技术博客教程【持续更新】 ↩︎

  7. hexo史上最全搭建教程 ↩︎

  8. 这可能是迄今为止最全的hexo博客搭建教程 ↩︎