太好了 👍
Hexo 是一个非常受欢迎的 静态博客框架,以简洁、高效、可定制著称,非常适合开发者或技术爱好者搭建个人博客。
下面我帮你整理一份 《Hexo 搭建与部署个人博客全教程(2025最新版)》,从零开始一步到位。
🚀 Hexo 搭建 / 部署个人博客教程(2025 全版)
一、Hexo 是什么?
Hexo 是一个基于 Node.js 的静态博客框架
通过 Markdown 写文章,生成静态 HTML 页面,可托管在 GitHub Pages、Vercel、Netlify 等平台。
📦 优点:
- 写作体验极佳(Markdown)
- 生成速度快
- 部署简单(可一键发布)
- 主题生态丰富(NexT、Butterfly、Matery 等)
二、环境准备
✅ 1. 安装 Node.js 和 npm
👉 打开命令行:
node -v
npm -v
如果没有安装,请前往:
建议安装 LTS 稳定版(如 20.x)。
✅ 2. 安装 Git
用于版本管理与部署。
Git 下载地址
安装后验证:
git --version
三、安装 Hexo
1️⃣ 全局安装 Hexo
npm install -g hexo-cli
2️⃣ 初始化博客项目
hexo init myblog
cd myblog
npm install
执行完成后,目录结构如下:
myblog/
├── _config.yml # Hexo 全局配置文件
├── package.json
├── source/ # 存放文章与页面
├── themes/ # 存放主题
└── public/ # 生成后的静态文件
四、启动本地服务器
本地预览:
hexo server
或简写:
hexo s
打开浏览器访问:
👉 http://localhost:4000
此时你已成功创建一个本地博客 🎉
五、写文章 ✍️
创建新文章:
hexo new "我的第一篇文章"
生成文件:
source/_posts/我的第一篇文章.md
用 Markdown 编辑即可。
例如:
---
title: 我的第一篇文章
date: 2025-10-07 10:00:00
tags: [Hexo, Blog]
---
欢迎来到我的 Hexo 博客!
六、生成静态页面
生成 HTML 文件:
hexo generate
或简写:
hexo g
生成结果保存在 public/
目录。
七、部署到 GitHub Pages(最推荐)
1️⃣ 创建 GitHub 仓库
在 GitHub 新建一个仓库,命名为:
yourname.github.io
例如:
ajie.github.io
2️⃣ 安装 Hexo 部署插件
npm install hexo-deployer-git --save
3️⃣ 修改 _config.yml
部署配置
打开根目录下 _config.yml
,找到底部的 deploy:
部分:
deploy:
type: git
repo: https://github.com/yourname/yourname.github.io.git
branch: main
4️⃣ 部署发布
执行:
hexo clean
hexo generate
hexo deploy
或简写为:
hexo cl && hexo g && hexo d
🚀 部署完成后,访问:
👉 https://yourname.github.io
你的网站上线啦!
八、更换主题(提升颜值)
Hexo 默认主题太朴素,推荐安装漂亮主题:
🔸 NexT 主题(最稳定)
git clone https://github.com/theme-next/hexo-theme-next themes/next
修改 _config.yml
:
theme: next
重新生成并启动:
hexo clean && hexo g && hexo s
👉 打开浏览器查看新主题。
🔸 其他热门主题:
主题 | 特点 | 地址 |
---|---|---|
Butterfly | 视觉炫酷、功能最全 | https://github.com/jerryc127/hexo-theme-butterfly |
Matery | Material Design 风格 | https://github.com/blinkfox/hexo-theme-matery |
Icarus | 响应式、简洁 | https://github.com/ppoffice/hexo-theme-icarus |
九、部署到 Vercel / Netlify(更灵活)
如果你不想使用 GitHub Pages,可以使用免费托管服务:
✅ Vercel 部署步骤:
- 登录 Vercel 官网
- 绑定 GitHub 仓库(yourname.github.io)
- 选择分支部署
- 自动生成域名,例如:
https://myblog.vercel.app
支持自动更新、CDN 加速,非常快 🚀
🔟 常用命令速查表
命令 | 作用 |
---|---|
hexo init blog | 初始化博客 |
hexo new "title" | 新建文章 |
hexo g | 生成静态页面 |
hexo s | 启动本地服务 |
hexo d | 部署到远程 |
hexo clean | 清理缓存与旧文件 |
💡 进阶玩法(推荐学习)
- ✅ 自定义域名(CNAME)
- ✅ 开启评论(Valine / Waline / Gitalk)
- ✅ 添加访问统计(不蒜子 / Google Analytics)
- ✅ SEO 优化(sitemap + robots.txt)
- ✅ 使用 GitHub Actions 实现自动部署
📘 总结:最推荐的组合
类型 | 工具 |
---|---|
博客框架 | Hexo |
主题 | Butterfly / NexT |
托管平台 | GitHub Pages + Vercel |
评论系统 | Waline / Gitalk |
写作工具 | Typora / VSCode + Markdown |
发表回复