本文只是简单记录一下笔者在使用 hexo 框架搭建个人博客时的操作过程和遇到的一些问题。由于笔者水平有限，遇到困难全靠百度和摆烂，所以本文纯属娱乐，八成是没什么用的。如果真的能给你带来一些帮助，笔者不胜荣幸。

笔者运行环境

  • macOS Big Sur 11.6

前期准备

创建 GitHub 仓库

在 GitHub 创建一个新的 repository，名字命名为以下格式：

1
"yourGithubName".github.io

设置为公共仓库，其他设置默认即可。

在本地配置git

在本地安装好 git 工具，在 macOS 上的安装方法为在终端输入以下命令：

1
$ brew install git

如果 brew 命令无效，则需要安装 brew，具体方法可以百度，在此不进行赘述。

也有其他的方式来安装 git，可以去百度上探索一下。

在本地安装 Node.js

Node.js 为 macOS 提供了官方的安装程序，在 Node.js 的官网下载页面上即可下载。

在本地安装 hexo

打开终端，输入以下命令：

1
$ npm install -g hexo-cli

安装好后，可以用以下命令执行hexo

1
$ npx hexo <command>

如果想省略 npx 前缀，需要讲 hexo 目录下的 node_modules 添加到环境变量中。笔者比较懒，没有搞，可以参考 hexo 官方文档中的方法。

另外，hexo 官方文档中也写明了 hexo 对 node.js 的版本限制。

若在这里如果出现以下错误

1
2
3
4
5
6
7
8
9
10
11
12
13
npm ERR! Error: EACCES: permission denied, access '/usr/lib/node_modules'

npm ERR! { Error: EACCES: permission denied, access '/usr/lib/node_modules'

npm ERR!  stack: 'Error: EACCES: permission denied, access \'/usr/lib/node_modules\'',

npm ERR!  errno: -13,

npm ERR!  code: 'EACCES',

npm ERR!  syscall: 'access',

npm ERR!  path: '/usr/lib/node_modules' }

则可以用以下方法解决，在命令行中依次输入

1
2
3
4
5
6
7
$ mkdir ~/.npm-global

$ npm config set prefix '~/.npm-global'

$ export PATH=~/.npm-global/bin:$PATH

$ npm install -g hexo

GitHub 的一系列设置

1. 生成 ssh key

macOS 是自带 ssh 的，因此不用安装。在此只要生成本机的 ssh key 即可。

打开终端，输入以下命令：

1
$ ssh-keyget -t rsa -C "yourMailAddress"

执行后按四次回车，不用输入任何命令。

在用户根目录下显示隐藏文件，找到 .ssh 文件，打开 id_rsa.pub，复制其内容至剪切板。

macOS 下显示隐藏文件方法为 shift + command + 。

2. 设置 GitHub SSH Keys

打开 GitHub 网站，进入 Settings，选择 SSH and GPG keys 选项卡。

在 Title 中输入你想要的称呼，将剪切板中的内容复制到 key 中。

点击 Add SSH key 按钮。

回到终端，在终端中输入以下命令：

1
$ ssh -T git@github.com

安装自动部署发布工具

打开终端，输入以下命令：

1
$ npm install hexo-deployer-git --save

安装完毕即可。

本地建站

hexo 生成文件

设置好以上内容后，在你想要的位置新建一个文件夹，在文件夹中打开终端，输入以下命令：

1
$ npx hexo init

hero 将会在终端所在的文件夹中新建所需要的文件。

新建完成后，指定文件夹的目录如下：

1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

在终端输入以下命令可以生成页面：

1
$ npx hexo g

在终端输入以下命令可以在本地服务器进行预览：

1
$ npx hexo s

打开浏览器，输入 localhost:4000 即可看到博客的预览。

如果 hexo s 命令有以下报错：

1
TypeError: Cannot read property 'utcOffset' of null

说明你和笔者一样手欠，在 _config.yml 文件中将时区 timezone 改成了什么乱七八糟的地方。重新改成 Asia/Shanghai就解决了。

修改配置文件

打开 _config.yml 文件，在最后添加以下内容：

1
2
3
4
5
6
7
deploy:

    type: git

    repo: https://github.com/"yourGithubName"/"yourGithubName".github.io.git

    branch: main

这里注意一定缩进要打满4个空格，英文冒号后面也要跟一个空格

修改完毕后保存。

这里你可以自己捣鼓一下，找一个现成的主题或者自己写一个主题。具体的美化工作就看你的想法了。hexo 的一系列操作可以参考 hexo 的官方文档。

部署 GitHub pages

在 GitHub 上申请令牌

打开 GitHub 上的 Settings，选择 Developer settings 选项卡，然后选择 Personnal access tokens 选项卡。

点击 Generate new token 按钮，输入密码。

在新建令牌页面中选择所有的权限（其实不用全选，但是笔者懒得挑了）。

点击生成令牌，在接下来的页面中截图或者复制得到的令牌，令牌只会出现一次，一定要记住。

将博客部署到 GitHub 上

在存有本地页面的文件夹中打开终端，输入以下命令：

1
2
3
$ npx hexo g

$ npx hexo d

依次输入 GitHub 的用户名和申请的令牌。

这里经常会失败，GitHub 的网站在国内还是8太行

成功之后，我们所有的工作就基本完成了，打开博客的仓库，点击 Settings，找到 Pages 选项卡，点击确认，博客就在 GitHub 上成功发布了。博客的网址就是仓库的名称，即 https://“yourGithubName".github.io。

最后

写到这里这篇文章也就结束了，笔者只是记录一下自己搭建个人博客的一个过程，以后也会在这个博客上继续分享个人的学习经历。如果你感兴趣的话，欢迎持续关注。