从零搭建个人博客：Hexo + NexT 主题安装与双线部署实战

Words 1719Read Time≈ 5 min
2019-8-11
2026-2-11
cover
type
Post
status
Published
date
Aug 11, 2019 00:16
slug
summary
本文手把手带你走完 Hexo 博客搭建全流程：环境准备、Hexo 安装、NexT 主题配置，以及 GitHub Pages 和 Coding Pages 的双线部署方案。附完整命令与截图，适合零基础读者快速上手。
tags
Hexo
category
Development
icon
password
wordCount
1713

前言

想拥有一个属于自己的博客，又不想碰后端数据库那些"重型武器"？Hexo 了解一下——一个基于 Node.js 的静态博客框架，用 Markdown 写文章，几秒钟生成整站，部署到 GitHub 或 Coding 就能免费上线。
本文手把手带你走完从零搭建 Hexo 博客的全流程：环境安装 → 博客初始化 → NexT 主题配置 → 部署上线（GitHub Pages + Coding Pages 双线部署）。

实验环境

🛠️
  • 操作系统：Windows 10
  • Node.js：12.15.0 / NPM：6.13.4
  • Git：最新版
  • Hexo CLI：最新版
  • 主题：NexT 7.7.2

安装Git

各平台安装方式：
  • Linux (Ubuntu/Debian)：sudo apt-get install git-core
  • Linux (Fedora/CentOS)：sudo yum install git-core
💡
Mac 用户注意：编译时如遇到问题，先到 App Store 安装 Xcode，然后进入 Preferences → Download → Command Line Tools → Install。

安装 Hexo

  1. 使用 npm 全局安装 Hexo CLI，安装后即可在任意位置执行 hexo 命令：
    1. 验证安装是否成功：
        2. 该命令会显示 Hexo 版本及所有依赖包信息。

    Hexo新建博客

    1. 初始化博客——打开命令行，输入：
        2. 该命令会创建一个 blog 文件夹，里面就是你的博客项目。
    1. 启动博客：
        2. 看到 INFO Hexo is running at http://localhost:4000 就说明启动成功了。打开浏览器访问 http://localhost:4000，你会看到默认的 landscape 主题博客：
        landscape

    Hexo安装主题

    默认的 landscape 主题虽然能用，但距离"好看"还有段距离。Hexo 的主题生态非常丰富，这里以最受欢迎的 NexT 主题为例。主题本质上就是 themes 文件夹下的一个子目录，结构如下：
    假设你的博客目录为 blog：
    1. 首先先把NexT主题的源码下载下来放在blog目录的theme目录下
        2. 下载完成后我们可以检查一下blog/theme里面是否多了next这个主题的文件夹
    1. 修改blog目录下的_config.yml 找到下面这行代码 theme: landscape 修改为 theme: next
    1. 重启Hexo 如果你的Hexo已经启动，按+停止，然后再次启动
        2.  
    1. 再次进入博客首页，会发现主题已经更改
        2. next
    其他主题也是类似的安装方法

    Hexo项目部署到GitHub Pages

    博客写好了，总得让别人看到。GitHub Pages 提供免费的静态页面托管服务，是 Hexo 博客最经典的部署方式。
    ⚡
    速度提示：GitHub Pages 服务器在海外，国内访问速度可能较慢。如果主要读者在国内，建议同时部署到 Coding Pages（见下一章节）。
    1. 安装插件
        2.  
    1. 首页要先到github上创建一个仓库，可以参考Github部署静态页面
    1. 生成本地密钥 首先打开cmd命令行（+，输入cmd，回车），输入
        2. 输入完毕后按回车，程序会要求输入一个密码，输入完密码后按回车会要求再确认一次密码，如果不想要密码可以在要求输入密码的时候按两次回次，表示密码为空，并且确认密码为空，此时[c盘>用户>自己的用户名>.ssh]目录下已经生成好了 复制[c盘>用户>自己的用户名>.ssh]目录下的id_rsa.pub文件的内容
     
    notion image
    1. 将密钥添加到github账号下
        2. notion image
        notion image
        notion image
    1. 修改blog目录下的_config.yml repo改为你的Github page仓库的ssh地址，右上角可以切换https与ssh的链接
        2.  
        notion image
    1. 使用hexo自带部署功能
        2. 如果出现下面提示 Are you sure you want to continue connecting (yes/no/[fingerprint])? 输入yes后回车 以后每次博客都可以这样来更新了

    Hexo项目部署到Coding Pages

    Coding 是国内的代码托管平台，同样提供免费静态页面服务。相比 GitHub Pages，最大优势就是 国内访问速度快。两个平台可以同时部署，实现"双线发布"。
    1. 安装插件
        2.  
         
    1. 首页注册一个coding账号 填写blog名与域名，验证个人信息完成注册
        2. notion image
    1. 实名认证，想要使用coding page的服务必须要实名认证 根据提示完成实名认证即可
        2. notion image
        notion image
        notion image
    1. 创建项目
        2. notion image
        notion image
        notion image
        notion image
    1. 部署静态页面 首先进入到项目页面，点击部署 等待部署成功 上面的访问地址就是我们的博客地址
        2. notion image
        notion image
    1. 添加ssh密钥 为了能免密码推送到仓库，需要配置密钥 首先打开cmd命令行（+，输入cmd，回车），输入(如果已经有密钥了就跳过)
        2. 复制[c盘>用户>自己的用户名>.ssh]目录下的id_rsa.pub文件的内容
         
        notion image
        在coding里创建一个密钥
         
        notion image
        notion image
    1. 修改blog目录下的_config.yml 配置成同时推送到github与coding，当我们更新博客的时候，两个仓库都会一起更新
        2.  
    1. 推送到仓库——命令行下输入：
        2. 如果出现 Are you sure you want to continue connecting? 提示，输入 yes 回车即可。

    GitHub Pages vs Coding Pages

    两种部署方式各有千秋，快速对比一下：
    对比项
    GitHub Pages
    Coding Pages
    服务器位置
    海外
    国内
    国内访问速度
    较慢
    快
    是否需要实名
    否
    是
    自定义域名
    支持
    支持
    推荐场景
    面向海外读者
    面向国内读者
    最佳实践是 双线部署——同时推送到 GitHub 和 Coding，一行命令搞定。

    结语

    从安装环境到双线部署，你的 Hexo 博客已经可以跑起来了。整个流程其实就三步：搭环境、选主题、推上线。
    Hexo 的玩法远不止于此，你还可以继续探索：
    • 自定义域名：绑定自己的域名，告别 .github.io 后缀
    • SEO 优化：安装 sitemap 插件，让搜索引擎更容易收录你的文章
    • 评论系统：集成 Gitalk、Valine 等评论插件，和读者互动起来
    • 持续部署：配合 GitHub Actions 实现 push 即发布，彻底自动化
    写博客最难的不是搭建，而是坚持。工具已经就绪，开始写吧。🚀
    Loading...