发表于 本文字数： 1.5k 阅读时长 ≈ 1 分钟

一、主题选择

选择博客主题时，我希望在保证博客功能性的前提下，使页面尽量简洁干净低调。查找相关资料了解到，hexo是一款非常快速，简介，高效的博客框架平台，我们可以利用hexo快速生成博客网站的模板，然后部署为我们自己的博客网站。而next是一款非常简洁舒服的主题，并且可支持的插件非常多，功能也很强大。因此我选择hexo作为基础框架，next作为博客的主题。

二、技术分享

前置内容

下载git

  • 下载网址：https://git-scm.com/download/win

  • 安装完成后，打开控制面板（win+R 输入cmd），输入git --version查看Git版本信息。

  • cmd输入以下命令配置用户名和邮箱（与Github账号一致）:

    1
    2
    git config --global user.name xxx
    git config --global user.email xxx@xx.com

下载nodejs

  • 下载网址：https://nodejs.org/en/download

  • 安装完成后，打开控制面板（win+R 输入cmd），输入node -v、npm -v查看版本信息。

Hexo搭建个人博客

  • 在任意盘符中新建 hexo 文件夹

  • 打开hexo文件夹，空白的地方右键，选择 Git Bash Here

  • 在弹出窗口中依次输入以下命令

    1
    2
    3
    4
    5
    npm install hexo-cli -g
    hexo init blog
    cd blog
    npm install
    hexo server

  • 然后输入这两条命令：

    1
    2
    hexo g 
    hexo s

  • 完成后显示Hexo is running at http://localhost:4000，则说明配置成功!此时打开浏览器，地址栏输入http://localhost:4000即可看到初始默认博客效果。

Hexo部署到github

  • 在github新建一个名为 username.github.io的仓库（其中username是github账号名）

  • 在hexo文件夹找到 _config.yml 文件，这是博客的配置文件，找到deploy部分，更改其中的内容如下所示

    1
    2
    3
    4
    5
    6
    # Deployment
    ## Docs: https://hexo.io/docs/one-command-deployment
    deploy:
      type: git
      repository: git@github.com:username/username.github.io.git
      branch: main

  • 安装git部署命令工具：

    1
    npm install hexo-deployer-git --save

  • 最后输入下面三条命令：

    1
    2
    3
    hexo clean
    hexo g
    hexo d

    其中 hexo clean清除了你之前生成的东西，也可以不加，可以用hexo cl缩写。hexo generate 顾名思义，生成静态文章，可以用 hexo g缩写，hexo deploy 部署文章，可以用hexo d缩写。

  • 如下链接即可访问你的博客：https://username.github.io（username替换成github账号名）

三、总结反思

  1. 技术过程可参考文章：https://blog.csdn.net/jj6666djdbbd/article/details/129321783 文章中包含更多细节技术实现

  2. Hexo的优点：

  • 纯静态文件，打开速度快。

  • 不依赖服务器。直接部署腾讯云 COS，静态站点走 CDN 内容分发。

  • 内容批量修改很方便。直接在编辑器全局替换就行，不用连数据库更新数据。

  1. Hexo的缺点：

  • 缺少动态页面功能，编写markdown文件虽然简单但也较为枯燥。

  • 只能依赖nodejs、git环境写博客。