不要在该奋斗的年纪选择了安逸;|

黎华扬

园龄:8年粉丝:4关注:3

Hexo 搭建个人博客

Hexo

1、hexo是什么?

Hexo是一个快速、简洁且高效的博客框架。可以把用户的markdown文件,按照指定的主题解析成静态网页。

作用:可以快递搭建个人博客。配置着github 可以免费搭建个人博客。

2、安装hexo

1、前提:安装使用hexo之前需要先安装Node.js

node.js安装 https://blog.csdn.net/m0_47759019/article/details/121874564

# 查询node 版本
node -v

2、安装hexo

npm install -g hexo-cli

3、查看已安装好的版本

hexo version

我这里输出的版本是:hexo-cli: 4.3.0

3、创建项目

1、进到自己项目存放的位置,例如:D:/hexo

# 初始化项目 hexo-project项目名,可自行更换
hexo init hexo-project
# 进行项目内
cd hexo-project
# 更新依赖
npm install

新建完成后,查看项目目录下有:

.
├── _config.yml:博客的配置文件
├── package.json:相关依赖信息
├── scaffolds:文章模板
├── source
|   └── _posts :默认创建文件存放位置
└── themes:主题

2、启动项目

# 生成静态文件,简写hexo g
hexo generate
# 启动项目,默认4000端口
hexo server
# 如果端口被占用,如果 -p 指定其它端口
hexo server -p 8080

访问

image

4、创建一篇新文章

4.1、添加文章

可以执行下面的命令创建一篇新文章

# 创建文件名为 使用hexo的第一天
hexo new 使用hexo的第一天

默认会在source\_posts创建文件(这个默认位置可以修改)

image

4.2、文档格式

我们使用文件编辑器打开刚刚新建的文件,会发现其中已经存在内容:

---
title: 使用hexo的第一天
date: 2022-05-26 20:03:10
tags:
---

这些内容是干嘛的呢?事实上,他们就是用于设置 MarkDown 文档在被解析为静态网页文件时的相关配置,这些配置参数一般位于文件中最上方以 --- 分隔的区域。

其中,title 的值是当前文档名,也是将来在网页中显示的文章标题。

date 值是我们新建文档时的当地时区时间。

tags 值是文档的标签,我们可以随意赋值为文档贴标签。其用法如下:

---
title: 使用hexo的第一天
date: 2022-05-26 20:03:10
tags:
- hello
- hexo
- markdown
---

4.3、文章分类

categories 是用来给文章分类的,它跟 tags 不同的是其具有顺序性和层次性。

例如,我们写一篇关于 CSS3 动画的文章,我们可能会为其打标签 ”CSS3“、”动画“等,但是我们却会将其分在 CSS/CSS3 类别下,这个是有一定的相关性、顺序性和层次性。简单来说,categories 有点儿像新建文件夹对文档进行分门别类的归置。

categories 的用法同 tags 一样,只不过斗个 categories 值是分先后顺序的。

可以在文件内写内容, 用Markdown语法。

4.4、文章摘要

有的时候,主题模板配置的不够好的话,Hexo 最终生成的静态站点是不会自动生成文章摘要的。

所以,为了保险起见,我们也自己手动设置文章摘要,这样也方便避免自动生成的摘要不优雅的情况。

设置文章摘要,我们只需在想显示为摘要的内容之后添 <!-- more --> 即可。

在文章中使用 <!-- more -->,那么 <!-- more --> 之前的文字将会被视为摘要。

<!-- more --> 截断前的文字,首页中将只出现这部分文字。

像下面这样:

---
title: 使用hexo的第一天
date: 2022-05-26 20:03:10
tags:

- hello
- hexo
- markdown
---



 感觉还不错,挺好的



他的官网是:https://hexo.io/zh-cn/

<!-- more -->

感觉有很多主题,速度快,上手速度

写完之后,可以在页面刷新即可访问到。

image

创建文件,其实是从scaffolds中的post.md复制过来的。

模板内容可以自行修改。

4.2、添加草稿

除了直接添加文章之外,还可以添加草稿

hexo publish 创建一篇草稿

5、更换主题

5.1、自己创建一个主题

官方文档:https://hexo.io/zh-cn/docs/themes

创建 Hexo 主题非常容易,您只要在 themes 文件夹内,新增一个任意名称的文件夹,并修改 _config.yml 内的 theme 设定,即可切换主题。一个主题可能会有以下的结构:

.
├── _config.yml
├── languages
├── layout
├── scripts
└── source

5.2、使用别人上传的主题

官方主题:https://hexo.io/themes/

这里推荐两个NexT 或者 butterfly

这里以 butterfly 为例,更换主题操作

官方指导文档:https://butterfly.js.org/posts/21cfbf15/

1、通过npm加载依赖(也可以下载源码)

npm i hexo-theme-butterfly

2、更换主题
修改 Hexo 根目录下的 _config.yml,把主题改为butterfly

3、安裝插件
如果你没有 pug 以及 stylus 的渲染器,请下载安裝:

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

6、插件

7、发布

发布有多个方式,这里主要讲两种方式:

1、将hexo部署到GITHUB/GITEE(免费搭建博客)

Hexo 部署到 Gitee(需要实名认证):https://blog.csdn.net/qq_38157825/article/details/112783631

2、编译后将静态文件放在自己服务器上

将\public目录的文件,放在服务器上即可。

8、扩展

Hexo 有趣功能盘点:https://blog.csdn.net/weixin_34405332/article/details/88704754

butterfly主题配置:https://blog.csdn.net/YR_112233/article/details/122778691

参考文章:https://blog.csdn.net/sinat_37781304/article/details/82729029

本文作者:黎华扬

本文链接:https://www.cnblogs.com/galenblog/p/16326249.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   黎华扬  阅读(164)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起