2022【保姆级教程】含泪搭建hexo博客 - 知乎 (zhihu.com)

环境部署

git下载和github相关工作

Git - Downloading Package (git-scm.com)

注册github账号(如果没有)

1
2
3
4
# 配置用户名和邮箱
git config --global user.name "github 用户名"
git config --global user.email "github 注册邮箱"

生成 ssh 密钥,本机密钥访问github

1
2
3

# 生成 ssh 密钥
ssh-keygen -t rsa -C "github 注册邮箱"

如下:

F/TYOPORA_Note/个人网站/relative/image-20230708223744855.png

密钥上传

上一个步骤生成 id_rsaid_rsa.pub 两个文件,前者是我们私有的,而后者则是对外开放的。接着找到生成的 .ssh 的文件夹中的 id_rsa.pub 密钥,将内容复制;id_rsa.pub位置可以用everything搜索,或者直接进入 [C:.ssh] 目录(要勾选显示“隐藏的项目”)

打开github

F/TYOPORA_Note/个人网站/relative/Snipaste_2023-07-08_22-42-42.png

复制到SSH中

node.js(npm)下载

Node.js (nodejs.org)

包存放路径

我们利用 npm 包管理器用来安装依赖包时,包会默认存放在 C:\Users\用户名\AppData\Roaming\npm\node_modules 目录下,如果你不确定你的包存放路径在哪儿,那么可以通过如下命令来进行查看:

1
npm root -g

由于第一次配置没有注意到这个问题,直接安到了C盘

F/TYOPORA_Note/个人网站/relative/image-20230708224822757.png

更改镜像源

1
npm config set registry https://mirrors.huaweicloud.com/repository/npm/

下载后验证版本

1
2
node -v
npm -v

hexo安装与部署

新建一个文件夹

在这个位置运行cmd/shell或bash。。

hexo安装

1
npm i hexo-cli -g

安装部署插件

1
npm install hexo-deployer-git --save

新建文章

1
hexo n "第一篇博客"

生成静态网页在public文件夹

1
hexo g

本地预览

1
hexo s

开放端口给浏览器,从4000端口进入网页

部署到github

github中新建一个“用户名.github.io的仓库”

本地配置

打开hexo根目录的__config.yml

deploy中repo配置为自己的仓库名,格式如下:

1
2
3
4
deploy:
type: git
repo: git@github.com:你的用户名/你的用户名.github.io.git
branch: master

示例:

1
2
3
4
deploy:
type: git
repo: git@github.com:Center-cr/Center-cr.github.io.git
branch: master

与github仓库连接

hexo根目录运行

1
ssh -T git@github.com

当出现Are you sure you want to continue connecting (yes/no/[fingerprint])? 输入yes等待,输出Hi xxx! You've successfully authenticated...时即连接成功

上传gitHub

hexo clean清除public

hexo g 产生public

hexo d 上传

1
2
3
hexo clean  
hexo g
hexo d

浏览器访问

1
用户名.github.io

butterfly配置

Butterfly - A Simple and Card UI Design theme for Hexo

安装butterfly

hexo根目录输入:

1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

安装插件

pug 以及 stylus 的渲染器:

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

应用

hexo中__config.yml更改

1
theme: butterfly

找到themes/butterfly/config.butterfly.yml,复制到hexo根目录

Hexo自动合并 _config.yml 和 _config.butterfly.yml 配置,优先考虑butterfly

我的配置如下:

https://wwsr.lanzoum.com/i144X11p884d