事先准备

  • 安装Git
  • 安装Nodejs

起步

  1. 安装hexo
    在命令行窗口或者Git BASH输入以下命令安装（-g代表是全局安装），安装完成后输入hexo-v验证是否安装成功。

    1
    npm install -g hexo-cli

  2. 初始化hexo
    在目标路径打开命令行窗口，输入以下命令初始化项目。

    1
    hexo init blog-demo(项目名)

    项目初始化完成后，可在命令行窗口输入hexo server或hexo s启动项目。

  3. 创建部署页面要用的GitHub/Gitee仓库
    也就是创建一个GitHub Pages，仓库的名称为用户名.github.io.git，另外分支名改为main。

  4. 建立hexo与git仓库的联系
    1.首先安装hexo-deployer-git

    1
    npm install hexo-deployer-git --save

    2.修改博客配置文件_config.yml

    1
    2
    3
    4
    deploy:
      type: git
      repository: git@github.com:username/username.github.io.git
      branch: main

    3.输入如下命令将代码部署到GitHub

    hexo clean && hexo generate && hexo deploy  // Git BASH终端
hexo clean; hexo generate; hexo deploy  // VSCODE终端

博客美化

  1. 选择喜欢的主题模板
  2. 安装模板并根据对应的文档进行配置
    主要是对博客配置文件config.yml和主题配置文件_config.主题名.yml进行操作，细则需要参考对应主题的使用文档。
  3. 配置完成后hexo三连，hexo clean && hexo g && hexo d，将博客部署到github/gitee上

优化相关

Vercel是一个代码托管平台，能够托管html静态页面。

  • 使用Vercel部署hexo博客，加快博客访问速度
    1. 登陆并注册vercel
    2. 新建vercel项目，关联github/gitee上的博客仓库
    3. 在项目的控制面板点击deploy进行部署
    4. 在vercel绑定自定义域名并在域名提供网站设置好解析
  • 使用Vercel部署github图床
    1. 新建github仓库用作图床
    2. 在vercel里关联图床仓库并部署
    3. 绑定自定义域名并在域名提供网站设置好解析

其他配置

  • twikoo评论
    1. 云函数部署
    2. 前端部署
    3. 开启邮箱通知功能
  • 欢迎信息定位
    1. 在腾讯位置服务获取key
    2. 在对应配置文件填写key
  • picGo结合markdown
    1. 获取图床的token
    2. 在picgo中进行配置
    3. 图床配置过程参考：https://www.fomal.cc/posts/d7fb1ba1.html

关键词

  • hexo
  • vercel
  • twikoo
  • 域名购买、绑定与解析
  • 定位功能
  • picGo

主要折腾点

  1. 博客的美化：需要参照对应文档实现自己的想法，文档没写/没找到的只能自己调试
  2. vercel部署与域名绑定
  3. 欢迎信息定位
  4. picGo与图床关联

参考文献

https://www.fomal.cc/posts/e593433d.html