建立一个属于你的博客!

文章发布时间:

最后更新时间:

使用HEXO部署静态网站的框架

准备工作

安装nodejs:https://nodejs.org/en/
安装git:https://git-scm.com/downloads
安装过程如果不熟就建议直接c盘战士

上github搭建仓库

点击这里跳转githubhttps://github.com/注册/登入账号
点击Create a new repository进入新建仓库页面
仓库名输入:

1
用户名.github.io

勾选 Public
勾选 Add a README file
拉到下面点击create创建

生成SSH Keys

桌面右键空白处然后点Git bash here(win11系统点击显示更多选项),输入
ssh-keygen -t rsa -C “你注册的github的邮件地址”
然后敲4次Enter
然后进入C:\Users\用户名,在里面进入.ssh文件
用记事本打开里面的id_rsa.pub,全选复制里面的代码
然后打开github
进入用户设置,找到SSH keys
新建SSH keys,名称随意,在下面粘贴代码,
然后创建

本地生成博客内容

在喜欢的位置新建一个文件夹,随意命名,然后进入文件夹
右键空白处然后点Git bash here,输入

1
npm install -g hexo-cli

安装hexo文件,如果不报错则成功,此时文件夹里还没有东西是正常的
接着输入

1
hexo init blog

没报错则成功,接着跳转进blog文件夹,输入

1
cd blog

然后

1
hexo install

上线博客

进入之前的blog文件夹,打开_config.yml(推荐用vscode)
拉到最下面将deploy后面的全删掉,复制粘贴这段

type: git
repository:
branch: main
注意缩进格式:每行前面都有两个空格不要删,每个冒号后面都有个空格也不要删!
去github之前生成的仓库页面,点code,复制https链接
将其粘贴到我们记事本中的repository:后面
然后保存退出
回到博客文件夹,git bash
安装自动部署发布工具

1
npm install hexo-deployer-git --save

然后在Blog文件夹右键打开git bash,依次输入

1
2
hexo g(生成)
hexo d(上传)

如果是第一次使用git的话会需要配置

git config –global user.email “你的github注册邮箱”
git config –global user.name “你的github用户名”
配置完后再hexo d上传
在跳出来的窗口内进行登录
接下来我们就成功把本地内容上传到github了
上传成功以后,我们就算搭建好了!上自己的网址看看吧
网址是我们之前设的仓库名:用户名.github.io

网站资料

我们的博客标题还是默认的hexo,整个页面是初始默认的,接下来我们对其进行修改
用记事本打开我们blog文件夹中的_config.yml文件
将#Site下面按自己的需求填上

1
2
3
4
5
6
7
8
## Site
title: 标题
subtitle: 副标题
description: 描述
keywords: 关键词
author: 站主
language: 语言(可以填写zh-CN)
timezone: 时区(可以填写Asia/Shanghai)

然后保存

后续长传文章操作

详细可查看官方文档https://hexo.io/zh-cn/docs/writing
这里也提供一个实例
先在vscode中打开 blog/source/_posts/ 文件夹,然后在其中新建文件,命名随意,但要记得加上后缀“.md”
如果你嫌麻烦,也可以

1
hexo new '你的文章名字'

然后在这个文本文件的最上面输入

1
2
3
4
5
6
7
---
title: 'Hello World !' //文章标题
date: 2025-04-15 21:54:02 //创建时间
tags: code //给该文章上标签,网站会自动生成该标签,通过该标签可找到该文章
category: Example //给该文章进行分类,同标签机制
---
(然后这里开始写你的文章内容,可使用MarkDown语法进行内容修饰)

markdown语法格式查阅看另一篇文章MarkDown语法查阅
写好文章后进入blog文件夹
然后开git bash
输入

1
hexo cl

清空一下之前的缓存
然后输入

1
hexo g

生成网页
接着输入

1
hexo d

将本地文件进行上传
当然在上传前也可以

1
hexo s

先本地查看一下网页效果怎么样

后续上传文章都是这个流程,十分滴方便

打赏
微信 | Wechat