MacOS下基于Github的Hexo博客搭建

Posted on Edited on In

使用arm64 m1/m2芯片的mac电脑搭建Hexo博客，在跟着官方文档搭建的过程中，会遇到一些问题，研究重试了好久，现重新将步骤整理如下。

首先可以参考官方文档 ，也可以直接根据本博客的步骤，很详细，适用于初学者。

1. Git安装

mac电脑可以直接打开App Store搜索“Xcode”安装，Xcode自带Git。

2. 使用node版本管理工具nvm，安装Node.js和npm

(注：不推荐使用Node installer，因为它会把npm安装到具有本地权限的目录中，在全局运行npm时可能会导致EACCES权限错误。
如果不慎出现EACCES权限错误，参考此文章：安装 Hexo 的过程中出现EACCES权限错误的解决方法 )

我们直接按照下面步骤，使用nvm安装Node.js和npm即可。

2.1 下载和安装nvm

2.1.1 在终端执行：

1
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash

或者

1
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash

此处链接可以直接复制，这是v0.39.3版本，你也可以在github获取最新版本地址：https://github.com/nvm-sh/nvm#installing-and-updating
2.1.2 验证是否安装成功：
在终端输入command -v nvm，如果输出 nvm 则说明安装成功。

2.2 使用nvm安装Node.js和npm

注：如果之前已经用其他方法安装过node.js，无需担心，nvm 会直接覆盖安装。
步骤如下：
2.1 在终端输入 nvm ls-remote ，列出都有哪些可用版本
2.2 从中选择一个安装，例如输入 nvm install v18.15.0
2.3 使用安装好的版本，例如输入 nvm use v18.15.0

3. Hexo安装

在终端输入 npm install -g hexo-cli ，使用npm安装Hexo。刚才2.1中是使用nvm装的npm，此时已经不会报错了。

4. Hexo初始化

4.1 在你想放Hexo博客项目的地方，新建一个文件夹（要确保文件夹里面是空的，否则初始化时会报错）。后续就称“Hexo文件夹”。
4.2 切换到Hexo文件夹目录：在终端输入cd 空格，然后把新建的文件夹拖入终端，再回车执行。
例如，cd /Users/kathy/my-blog
4.3 cd到目的文件夹后，输入hexo init
4.4 如果想部署在GitHub，终端输入下方代码：
npm install hexo-deployer-git --save

5. 预览Hexo【本地】

终端输入hexo g -s
打开你新建的hexo文件夹，找到public文件夹中的index.html文件，用浏览器打开，就可以看到你的本地主页了。

6. 把你的Hexo发布至Github

6.1 配置SSH密钥

(1) 打开Mac的Finder，上方菜单中，选择“文件” - “前往文件夹”，输入：~/.ssh/id_rsa.pub，看看有没有id_rsa.pub文件。

  • 如果有，用记事本打开看是否有内容
  • 如果没有该文件(~/.ssh/id_rsa.pub)，在终端输入：ssh-keygen -t rsa -C "your_email@example.com" 这个邮箱随便写，然后一路回车。输密码的那段也直接回车，就会自动生成文件(~/.ssh/id_rsa.pub)。
    再次搜索，找到该文件，用记事本打开。
    (2) 复制id_rsa.pub中的内容，到Github网站（需要你提前登录）-右上角个人- setting - SSH keys，添加密钥。密钥名称随便写，方便你认就可以。
    (3) 终端输入ssh -T git@github.com 测试

6.2 设置用户信息(用户名和邮箱)

每次git提交时都会使用该用户信息。
(1) git config --global user.name" 写用户名
例如，~ % git config --global user.name "kathy-kx"
(2) git config --global user.email" 写你的邮箱
例如，~ % git config --global user.email "xxxxxx@qq.com"

6.3 建立Github仓库

并命名它为：你的Github用户名.github.io。
例如，我的Github用户名是kathy-kx，则此处命名为：kathy-kx.github.io

6.4 修改配置文件。

在本地hexo文件夹（刚才新建的my-blog文件夹）的_config.yml中，修改以下部分。

1
2
3
4
deploy:
	type: git
	repo: <repository url>  # 从你的仓库主页Clone or download复制 注意：改成SSH模式,后缀是.git
	branch: master # 你的默认仓库分支

6.5 生成静态文件，并部署网站

cd到hexo文件夹下，执行hexo g -d

6.6 查看博客

浏览器打开：你的Github用户名.github.io，例如kathy-kx.github.io，就可以看到网页了。
如果不行，尝试清理浏览器缓存，再重新打开。

7. 更换主题

此时的主题是默认的主题，我们可以更换成自己喜欢的主题。
(1) 在 https://hexo.io/themes/ 选一个喜欢的，下载下来，放到 hexo的theme文件夹内。
(2) 先cd到hexo文件夹下，执行 git clone https://github.com/next-theme/hexo-theme-next themes/next （此处使用的是next主题）
(3) 找到hexo文件夹下的_config.yml中theme部分，把名字改成theme文件夹内你下载来的主题名字。
例如：theme: next
img
(4) 还可以顺便修改一下作者和简介
把hexo文件夹下的_config.yml文件中的author换成你的名字，简介description也可以改。

1
2
3
# Site
author:
description:

(5) 执行hexo clean（清理Hexo缓存）、hexo s --debug（测试模式启动Hexo服务器，可以d先在本地检查）和hexo g -d（生成静态文件后部署），现在再次访问你的博客，主题就已经更改好了。