博客搭建

从零开始搭建个人独立博客 (Hexo + GitHub Pages)

本文将详细指导您如何从零开始,使用 Hexo 框架和 GitHub Pages 搭建一个个人独立博客。请按照步骤操作,勿跳过任何环节。

1. 准备工作

1.1. 下载并安装必要工具

  • Node.js: 访问 Node.js 官网 下载并安装。建议安装 LTS (长期支持) 版本。
  • Git: 访问 Git 官网 下载并安装。安装过程一路点击“下一步”选择默认设置即可。

1.2. 验证安装

以管理员身份运行命令提示符 (CMD) 或 Git Bash,依次输入以下命令并检查版本信息:

1
2
3
node -v
npm -v # npm 是 Node.js 自带的包管理器
git -v

2. 安装 Hexo

打开命令提示符 (CMD) 或 Git Bash,执行以下命令全局安装 Hexo 命令行工具:

1
npm install -g hexo-cli

3. 搭建 GitHub 仓库

GitHub Pages 将用于托管您的博客静态页面。

  1. 注册/登录 GitHub 账号。
  2. 点击右上角“+”号,选择 New repository (新建仓库)。
  3. Repository name (仓库名) 处,严格按照格式输入:your_github_username.github.io (例如:octocat.github.io)。
  4. 选择 Public (公开)。
  5. 勾选 Add a README file (添加 README 文件)。
  6. 点击 Create repository (创建仓库)。

4. 生成并配置 SSH Keys

SSH Keys 用于本地 Git 和 GitHub 之间的安全通信。

  1. 在任意文件夹内右键,选择 Git Bash Here,输入以下命令生成 SSH Key:

    1
    ssh-keygen -t rsa -C "your_email@example.com"

    过程中会提示输入密码,直接按 4 次 Enter 键跳过即可(不设置密码)。

  2. 找到生成的公钥:
    默认路径在 C:\Users\YourUsername\.ssh\,找到 id_rsa.pub 文件。
    用记事本或其他文本编辑器打开 id_rsa.pub,复制其中所有内容。

  3. 将公钥添加到 GitHub:
    登录 GitHub,点击右上角用户头像 -> Settings (设置)。
    在左侧导航栏找到 SSH and GPG keys
    点击 New SSH key (新建 SSH Key)。
    Title (标题) 随意填写,将复制的公钥内容粘贴到 Key (密钥) 文本框中。
    点击 Add SSH key (添加 SSH Key)。

  4. 测试 SSH 连接:
    在 Git Bash 中输入:

    1
    ssh -T git@github.com

    首次连接会提示确认,输入 yes 并回车。如果看到 “Hi your_username! You’ve successfully authenticated…” 的信息,则表示配置成功。

5. 本地初始化博客

  1. 在您喜欢的位置新建一个文件夹,例如 MyBlog (或 Blog),进入该文件夹。

  2. 在该文件夹内右键,选择 Git Bash Here,执行以下命令初始化 Hexo 博客:

    1
    hexo init

    注意:如果遇到 hexo 命令未找到的错误,尝试在命令前加上 npx,例如 npx hexo init

  3. 安装 Hexo 依赖:

    1
    npm install
  4. 生成并启动本地服务器:
    依次执行以下命令:

    1
    2
    hexo generate  # 简写为 hexo g
    hexo server # 简写为 hexo s

    提示:如果 hexo s 启动失败,可以尝试重复执行,有时是网络连接不稳定导致。

  5. 在浏览器中打开提示的链接 (通常是 http://localhost:4000),您应该能看到默认的 Hexo 博客页面。

  6. 回到 Git Bash 窗口,按 Ctrl + C 关闭本地服务器。

6. 安装 Git 部署插件

在您的博客根目录 (即 MyBlog 文件夹) 下打开 Git Bash,执行:

1
npm install hexo-deployer-git --save

7. 配置并部署博客到 GitHub Pages

  1. 配置 _config.yml 文件:
    在您的博客根目录 (MyBlog 文件夹) 下,用文本编辑器 (如记事本、VS Code) 打开 _config.yml 文件。
    滚动到文件最底部,找到 deploy: 部分。如果存在,删除其下的所有内容。
    将以下配置粘贴到 deploy: 下方,并注意缩进:

    1
    2
    3
    4
    deploy:
    type: git
    repository: <YOUR_REPOSITORY_HTTPS_URL>
    branch: main

    重要

    • 确保 typerepositorybranch 前面各有 两个空格
    • 每个冒号 : 后面都有一个空格。
  2. 获取仓库 HTTPS URL:
    回到您的 GitHub 仓库页面 (your_github_username.github.io)。
    点击绿色的 Code 按钮,选择 HTTPS 选项卡,然后复制显示的 URL (例如:https://github.com/your_username/your_username.github.io.git)。

  3. 粘贴 URL 并保存:
    将复制的 HTTPS URL 粘贴到 _config.yml 文件中 repository: 后面的位置。
    保存 _config.yml 文件。

  4. 生成并部署博客:
    在博客根目录的 Git Bash 中,依次执行以下命令:

    1
    2
    hexo generate # 生成静态文件
    hexo deploy # 部署到 GitHub Pages

    注意:首次部署可能需要您输入 GitHub 用户名和密码。

7.1. (可选) Git 代理配置 (针对网络受限情况)

如果您使用代理工具 (如 Clash Verge),且遇到 hexo d 部署失败,可能需要为 Git 配置代理。假设您的代理端口为 7897

  1. 清除现有代理设置 (可选,避免冲突):

    1
    2
    git config --global --unset http.proxy
    git config --global --unset https.proxy
  2. 设置 HTTP/HTTPS 代理:

    1
    2
    git config --global http.proxy http://127.0.0.1:7897
    git config --global https.proxy http://127.0.0.1:7897
  3. 验证代理设置:

    1
    2
    git config --global --get http.proxy
    git config --global --get https.proxy

    配置完成后,再次尝试 hexo deploy

7.2. (首次使用 Git) 配置用户信息

如果您是首次在当前设备上使用 Git,需要配置您的全局用户信息:

1
2
git config --global user.email "your_email@example.com"
git config --global user.name "Your Name"

配置完成后,再次执行 hexo deploy

部署成功后,您的博客即可通过 https://your_github_username.github.io 访问。

8. 博客基本信息配置

打开博客根目录下的 _config.yml 文件,找到 Site 部分,根据您的需求修改以下内容:

1
2
3
4
5
6
7
8
# Site
title: 您的博客标题
subtitle: 您的副标题
description: 您的博客描述
keywords: 您的关键词 (用逗号分隔)
author: 您的名字
language: zh-CN # 语言
timezone: Asia/Shanghai # 时区

保存文件后,重新执行 hexo generatehexo deploy 使更改生效。

9. 发布新文章

  1. 创建新文章:
    在博客根目录的 Git Bash 中,执行以下命令创建新的 Markdown (.md) 文章文件:

    1
    hexo new "您的文章标题"

    新文章文件将生成在 source/_posts/ 目录下。

  2. 编辑文章:
    您可以使用任何 Markdown 编辑器打开 .md 文件进行编辑。推荐使用 Typora (请支持正版)。

  3. 生成并部署:
    文章编辑完成后,保存文件,然后在 Git Bash 中执行:

    1
    2
    hexo generate
    hexo deploy

    您的新文章将发布到博客中。

10. 后续优化与建议

  • 主题选择与美化:Hexo 拥有丰富的社区主题,您可以访问 Hexo 官网主题页 浏览并选择您喜欢的主题(例如:ButterflyAnzhiyu)。安装和配置主题通常有详细的文档。

至此,您的个人独立博客已基本搭建完成!