hexo安装

  • 参考官网:文档 | Hexo
  • 初学者可配置部署到GithubPages

hexo博客基本教程

三步

  1. 写文章
  2. 生成静态文件
  3. 部署

写博客+发布

文章yaml 配置,格式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
categories:
- [软件]
- [软件,PC软件]
tags:
- [markdown笔记]
- [Typora]

#########################
tag
用法:

tags:
- 123
- 456
tags: [123, 456]
多标签写法,这2种都是一样的效果,用哪个都可以,建议使用列表[]式,直观清晰。

categories
# 这是默认的写法,给文章添加一个分类。
categories: 123
# 这会将文章分类123/456子分类目录下。
categories: [123, 456]
这会将文章分类到123/456子分类目录下。
categories:
- 123
- 456
多分类写法,文章被分类到123、456以及123的自分类789这3个分类下面,官方指定写法。
categories:
- [123]
- [456]
- [123, 789]

流程

  1. 打开命令行工具,进入安装目录

  2. 执行命令 hexo new aarticle_name

  3. 编辑文章

  4. 创建静态文件以及发布

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    # 先清理本地静态文件
    hexo clean

    # 会在文章yaml中,生成abbrlink
    hexo g
    # 本地查看博客
    hexo s
    # hexo 预览草稿的命令
    hexo s --draft
    # 发布
    hexo d

举例

  1. 进入博客目录

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    PS D:\NotesRead\JLChenBlog\cjlBlog> ls -n
    .deploy_git
    .github
    node_modules
    public
    scaffolds
    source
    themes
    .npmignore
    baidu_verify_codeva-IM1t1kJq3P.html
    db.json
    package-lock.json
    package.json
    upPages.js
    _config.butterfly.yml
    _config.landscape.yml
    _config.yml

  2. 创建文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    PS D:\NotesRead\JLChenBlog\cjlBlog> hexo new Shell函数返回值详解
    INFO Validating config
    INFO
    ===================================================================
    ##### # # ##### ##### ###### ##### ###### # # #
    # # # # # # # # # # # # #
    ##### # # # # ##### # # ##### # #
    # # # # # # # ##### # # #
    # # # # # # # # # # # #
    ##### #### # # ###### # # # ###### #
    4.7.0
    ===================================================================
    INFO Created: D:\NotesRead\JLChenBlog\cjlBlog\source\_posts\Shell函数返回值详解.md
  3. 编辑文章

  4. 建议发布前,先本地查看一下
    D:\NotesRead\JLChenBlog\cjlBlog> hexo c;hexo g;hexo s;

  5. 发布
    D:\NotesRead\JLChenBlog\cjlBlog> hexo d

写草稿

hexo new draft

发布草稿文章

1
2
hexo p draft_article_Name

博客发布后

hexo hexo g 渲染之后,会在安装目录生成一个 public文件夹

  1. 会把主题文件夹source\js 复制到该 文件夹
  2. 渲染文档生成各目录文章的html网页, robots.txt 保存到 public
  3. 生成sitwmap.xml,
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
PS D:\NotesRead\JLChenBlog\cjlBlog> ls .\public\ -n
.github
about
archives
categories
css
Gallery
img
js
link
movies
music
posts
tags
baidusitemap.xml
baidu_urls.txt
baidu_verify_codeva-IM1t1kJq3P.html
googled04202478301504d.html
index.html
robots.txt
search.xml
sitemap.xml

常用命令详解

更多请查看API | Hexo

new

1
$ hexo new [layout] <title>

新建一篇文章。如果没有设置 layout 的话,默认使用 _config.yml 中的 default_layout 参数代替。如果标题包含空格的话,请使用引号括起来。

1
$ hexo new "post title with whitespace"
参数 描述
-p, --path 自定义新文章的路径
-r, --replace 如果存在同名文章,将其替换
-s, --slug 文章的 Slug,作为新文章的文件名和发布后的 URL

默认情况下,Hexo 会使用文章的标题来决定文章文件的路径。对于独立页面来说,Hexo 会创建一个以标题为名字的目录,并在目录中放置一个 index.md 文件。你可以使用 --path 参数来覆盖上述行为、自行决定文件的目录:

1
hexo new page --path about/me "About me"

以上命令会创建一个 source/about/me.md 文件,同时 Front Matter 中的 title 为 "About me"

注意!title 是必须指定的!如果你这么做并不能达到你的目的:

1
hexo new page --path about/me

此时 Hexo 会创建 source/_posts/about/me.md,同时 me.md 的 Front Matter 中的 title 为 "page"。这是因为在上述命令中,hexo-cli 将 page 视为指定文章的标题、并采用默认的 layout

generate

1
$ hexo generate

生成静态文件。同时会在文章yaml中,生成abbrlink

选项 描述
-d, --deploy 文件生成后立即部署网站
-w, --watch 监视文件变动
-b, --bail 生成过程中如果发生任何未处理的异常则抛出异常
-f, --force 强制重新生成文件 Hexo 引入了差分机制,如果 public 目录存在,那么 hexo g 只会重新生成改动的文件。 使用该参数的效果接近 hexo clean && hexo generate
-c, --concurrency 最大同时生成文件的数量,默认无限制

该命令可以简写为

1
$ hexo g

publish

1
$ hexo publish [layout] <filename>

发表草稿。

server

1
$ hexo server

启动服务器。默认情况下,访问网址为: http://localhost:4000/

选项 描述
-p, --port 重设端口
-s, --static 只使用静态文件
-l, --log 启动日记记录,使用覆盖记录格式

deploy

1
$ hexo deploy

部署网站。

参数 描述
-g, --generate 部署之前预先生成静态文件

该命令可以简写为:

1
$ hexo d

关于写博客的一些问题

Tags 和Categories的主要区别

每一篇文章都需要一个category,而Tags 是可选的,以下是Tags 和Categories的主要区别:

  1. Categories是分层的,而Tags 标签是不分层的。基本上,这意味着Categories可以有一个父类目和子类目。但是对于Tags 标签来说,没有任何父子关系;每个标签都是一个100%独立的实体。
  2. Categories应该有广泛的主题,适用于许多不同的文章,
    而Tags 通常是那篇文章包含的“更具体和独特的”实际内容。

例如,一篇关于芝加哥公牛队篮球运动员迈克尔·乔丹的WordPress文章,其标签和Categories示例如下:

(1)Categories:篮球(broad广泛)

(2)Tags 标签:Michael Jordan(迈克尔·乔丹),Chicago Bulls芝加哥公牛队(仅限于post)

文章中使用html,引入js

js存放目录应为 D:\NotesRead\JLChenBlog\cjlBlog\themes\butterfly\source\js

主题目录source\js

进一步折腾

hexo美化

hexo美化,使用主题

本博客使用BUtterfly主题

美化教程参考BUtterfly主题官网

评论系统

giscus

Butterfly 安裝文檔(四) 主題配置-2 | Butterfly

参考

  1. 文档 | Hexo
  2. butterfly
  3. https://blog.csdn.net/weixin_46267040/article/details/125369571
  4. Typora+PicGo-Core+时间戳重命名 - Connor
  5. giscus