环境搭建

1.安装Node.js

这个最容易出现问题,而且出错了非常难搞,尽量避免踩坑

建议直接跟视频或教程走,下面给出推荐:

Node.js安装与配置(详细步骤)_nodejs安装及环境配置_liyitongxue的博客-CSDN博客

【Node.js安装及环境变量配置】https://www.bilibili.com/video/BV19F411t7zX?vd_source=ae8b0afb70b0888f747c6c427dee5317

友情提示:

1.对于不是第一次安装node.js的朋友一定要看自己的npm 版本与node版本是否对应,尽量选择15版本以上的。

image-20230526225434376

2.配置好环境变量后可以测试下面代码,如果成功其余的错误也可以忽略,我们只用npm也可以安装hexo,其中cnpm随缘安装。

1
npm install express -g

image-20230526225954481

2.安装hexo

以管理员身份进入终端,以win11为例

image-20230526230331907

执行下面命令

1
2
3
4
5
6
7
8
9
10
11
npm install hexo-cli -g #安装hexo

npm install hexo-deployer-git --save #安装部署插件

hexo init myblog #其中myblog可以替换为自己喜欢的名字

cd myblog #切换到博客根目录

npm install #安装环境

hexo server #本地启动

浏览器中访问地址 “localhost:4000/”,可以预览我们的博客。

新建博客:

1
hexo n "第一篇博客" # 新建一个名为第一篇博客.md的文件

关于博客文件目录,我们目前只需要知道以下几个重要的文件目录即可:

public目录下存放的是我们生成的「静态页面」

source/_posts目录下存放的是我们写的「文章」

themes目录下存放的是「博客」的主题;

_config.yml「博客全局配置」文件;

_config.landscape.yml「博客主题配置」文件。

部署到GitHub上

1.安装Git

注册git账号:https://github.com/并记住用户名和密码

下载地址:Git - Downloads (git-scm.com)鼠标右键显示Git Bash Here就表示安装Git成功了。

image-20230519100001099

2.配置Git

1
git config --global user.name "Your Name"
1
git config --global user.email "邮箱"

是否已经登录

1
git config user.name

生成密钥

1
ssh-keygen -t rsa -C "邮箱"

image-20230519101945342

将其中Your Name替换为用户名,邮箱替换为自己注册时的邮箱

如图所示,密钥已经给我们生成到C:/Users/UserName/.shh/id_rsa文件下了。

打开该目录下的id_rsa.pub文件,用记事本打开并复制这个密钥。

image-20230519102405079

去GitHub上验证

登录github ->进入设置->SSH and GPG key ->新建密钥,把上面文件里的内容全部复制粘贴进去即可。

image-20230519102810743

image-20230519103144116

image-20230519103248279

在Git Bash里输入ssh -T git@github.com ,成功的话会出现
You’ve successfully authenticated, but GitHub does not provide shell access.。

3.新建仓库

在github上新建一个仓库

image-20230519145847289

image-20230519150254713

image-20230519152023033

4.部署到Git

1
2
3
4
hexo -c #清理缓存
hexo clean
hexo g # 生成静态网页
hexo d #部署到Git

浏览器输入”https://仓库名”即可。

推荐视频教程

mac版:

【手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo】https://www.bilibili.com/video/BV1Yb411a7ty?vd_source=ae8b0afb70b0888f747c6c427dee5317

windows版:

【Hexo搭建个人博客——系列教程】https://www.bilibili.com/video/BV1q741167PJ?vd_source=ae8b0afb70b0888f747c6c427dee5317

如果想让自己的博客更加美观,可以设置主题以我现在使用的为例给出官方网站以及视频教程链接:

【使用Hexo搭建个人博客手摸手教学(8)|butterfly主题页面配置】https://www.bilibili.com/video/BV1Fb4y1r7ja?vd_source=ae8b0afb70b0888f747c6c427dee5317

官方文档:

Butterfly 安裝文檔(一) 快速開始 | Butterfly