19 Hexo API 开发网站教程 - 部署到 GitHub Pages

在这一小节中，我们将详细介绍如何将使用 Hexo 创建的网站部署到 GitHub Pages。Hexo 是一个快速、简洁且高效的静态博客框架，能够让开发者轻松地搭建网站。下面将分步骤进行说明。

前提条件

要将 Hexo 部署到 GitHub Pages，你需要：

• 一个已安装的 Node.js 环境
• 安装 Git 版本控制工具
• 一个 GitHub 账户

创建 Hexo 博客

如果你还没有创建 Hexo 博客，可以按照以下步骤进行：

1. 安装 Hexo:

   npm install -g hexo-cli

2. 创建新项目:

   hexo init my-blog
   cd my-blog
   npm install

3. 生成静态文件:

   在 my-blog 目录下，运行以下命令，生成静态文件：

   hexo generate

4. 启动本地服务器:

   使用下面的命令启动 Hexo 本地服务器以预览博客：

   hexo server

   访问 http://localhost:4000 可以查看你的博客。

配置 _config.yml

在项目根目录下找到 _config.yml 文件，进行如下配置：

# URL
url: http://<username>.github.io/<repository>

# Deployment
deploy:
  type: git
  repository: https://github.com/<username>/<repository>.git
  branch: gh-pages

请替换 <username> 和 <repository> 为你的 GitHub 用户名和仓库名称。

创建 GitHub 仓库

1. 登录到 GitHub，点击右上角的 + 按钮，选择 New repository。
2. 为你的仓库命名，选择 Public，然后点击 Create repository。

安装 Hexo 部署插件

在 Hexo 博客根目录下，安装 Hexo 部署插件：

npm install hexo-deployer-git --save

部署博客到 GitHub Pages

1. 确保 Git 配置正确（用户信息），可以使用下面的命令：

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

2. 使用 Hexo 命令部署：

   hexo deploy

   这个命令会生成静态文件并将其推送到 GitHub 上的 gh-pages 分支。

验证部署

1. 等待几分钟让 GitHub Pages 更新。
2. 访问 http://<username>.github.io/<repository> 验证你的网站是否成功部署。

小结

通过以上步骤，你已成功地将你的 Hexo 博客部署到 GitHub Pages。请注意，未来每次更新内容后，记得重新运行 hexo generate 和 hexo deploy 命令来更新网站。

常见问题

• 网站未正确显示：请检查 _config.yml 中的 url 配置是否正确。
• 404 错误：确认你是否在 GitHub 上启用了 gh-pages 分支。

感谢你学习如何使用 Hexo 部署到 GitHub Pages。希望你能在这个平台上创作出精彩的内容！