Hexo 笔记

NexT 仓库

NexT 一共有三个不同的仓库：

版本	年份	仓库
v5.1.4 或更低	2014 ~ 2017	https://github.com/iissnan/hexo-theme-next
v6.0.0 ~ v7.8.0	2018 ~ 2019	https://github.com/theme-next/hexo-theme-next
v8.0.0 或更高	2020	https://github.com/next-theme/hexo-theme-next

配置文件

注意：此方法不适合 Hexo 5.0 ，Next 8.0.0 建议使用：

• Configuration | NexT
• Configuration | Hexo

Hexo 根目录 _config.yml： 站点配置文件

themes/next/_config.yml ：主题配置文件

字符计数

Next v7.8.0

代码语言：javascript复制

# Post wordcount display settings
# Dependencies: https://github.com/theme-next/hexo-symbols-count-time
symbols_count_time:
  separated_meta: true
  item_text_post: true
  item_text_total: true

Next v8.2.1

代码语言：javascript复制

# Post wordcount display settings
# Dependencies: https://github.com/next-theme/hexo-word-counter
symbols_count_time:
  separated_meta: true
  item_text_post: true
  item_text_total: true

注意： 本人依然使用的 https://github.com/theme-next/hexo-symbols-count-time 而不是 新版本的 https://github.com/next-theme/hexo-word-counter

代码块 显示复制按钮

Next v7.8.0

代码语言：javascript复制

codeblock:
  # Code Highlight theme
  # Available values: normal | night | night eighties | night blue | night bright | solarized | solarized dark | galactic
  # See: https://github.com/chriskempson/tomorrow-theme
  highlight_theme: normal
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Show text copy result.
    show_result: true
    # Available values: default | flat | mac
    style:

Next v8.2.1

代码语言：javascript复制

codeblock:
  # Code Highlight theme
  # All available themes: https://theme-next.js.org/highlight/
  theme:
    light: default
    dark: tomorrow-night
  prism:
    light: prism
    dark: prism-dark
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Available values: default | flat | mac
    style:

数学公式

设置后，每页都加载所需 LaTex 脚本，而无需在头部添加 mathjax: true Next v7.8.0

代码语言：javascript复制

# Math Formulas Render Support
math:
  # Default (true) will load mathjax / katex script on demand.
  # That is it only render those page which has `mathjax: true` in Front-matter.
  # If you set it to false, it will load mathjax / katex srcipt EVERY PAGE.
  per_page: false

  # hexo-renderer-pandoc (or hexo-renderer-kramed) required for full MathJax support.
  mathjax:
    enable: true
    # See: https://mhchem.github.io/MathJax-mhchem/
    mhchem: false

  # hexo-renderer-markdown-it-plus (or hexo-renderer-markdown-it with markdown-it-katex plugin) required for full Katex support.
  katex:
    enable: false
    # See: https://github.com/KaTeX/KaTeX/tree/master/contrib/copy-tex
    copy_tex: false

Next v8.2.1

代码语言：javascript复制

# Math Formulas Render Support
# Warning: Please install / uninstall the relevant renderer according to the documentation.
# See: https://theme-next.js.org/docs/third-party-services/math-equations
# Server-side plugin: https://github.com/next-theme/hexo-filter-mathjax
math:
  # Default (false) will load mathjax / katex script on demand.
  # That is it only render those page which has `mathjax: true` in front-matter.
  # If you set it to true, it will load mathjax / katex srcipt EVERY PAGE.
  every_page: true

  mathjax:
    enable: true
    # Available values: none | ams | all
    tags: none

  katex:
    enable: false
    # See: https://github.com/KaTeX/KaTeX/tree/master/contrib/copy-tex
    copy_tex: false

图片放大

Next v7.8.0 Next v8.2.1

代码语言：javascript复制

# FancyBox is a tool that offers a nice and elegant way to add zooming functionality for images.
# For more information: https://fancyapps.com/fancybox
fancybox: true

本地搜索

Next v7.8.0 Next v8.2.1

代码语言：javascript复制

# Local Search
# Dependencies: https://github.com/theme-next/hexo-generator-searchdb
local_search:
  enable: true
  # If auto, trigger search by changing input.
  # If manual, trigger search by pressing enter key or search button.
  trigger: auto
  # Show top n results per article, show all results by setting to -1
  top_n_per_article: 1
  # Unescape html strings to the readable one.
  unescape: false
  # Preload the search data when the page loads.
  preload: false

相关文章

Next 主题为例

1. 安装依赖

代码语言：javascript复制

npm install hexo-related-popular-posts --save

1. 主题配置文件

enable: true

代码语言：javascript复制

# Related popular posts
# Dependencies: https://github.com/tea3/hexo-related-popular-posts
related_posts:
  enable: true
  title: # Custom header, leave empty to use the default one
  display_in_home: false
  params:
    maxCount: 5
    #PPMixingRate: 0.0
    #isDate: false
    #isImage: false
    #isExcerpt: false

修改 post 模板

在 Hexo 根目录下 修改 scaffolds/post.md

代码语言：javascript复制

---
title: {{ title }}
date: {{ date }}
tags:
categories:
---

新增一行 categories:，这样 每次 hexo n postname 时就会有 categories:

Next 文章目录 自动编号

取消 Next 文章目录（侧边栏） 标题 的自动编号：number: false

Hexo v5.0 ( ) Next v7.8.0 Next v8.2.1 _config.next.yml

代码语言：javascript复制

# Table of Contents in the Sidebar
# Front-matter variable (unsupport wrap expand_all).
toc:
  enable: true
  # Automatically add list number to toc.
  number: false
  # If true, all words will placed on next lines if header width longer then sidebar width.
  wrap: false
  # If true, all level of TOC in a post will be displayed, rather than the activated part of it.
  expand_all: false
  # Maximum heading depth of generated toc.
  max_depth: 6

添加 languages

在 Hexo根目录/source/_data 创建 languages.yml 文件

内容如下：

代码语言：javascript复制

---

zh-CN:
  menu:
    portfolio: 作品集

即可为 portfolio 添加中文翻译为 作品集

注意：顶部有 ---， 但底部结束没有 ---，笔者试过底部结束加 ---，结果 hexo s 时报错了。

常见错误

代码语言：javascript复制

err: YAMLException: can not read a block mapping entry; a multiline key may not be an implicit key at line 2, column 5:

YAML格式错误，title: 后有一个空格，依然报此错

原因：使用了 读书笔记，注意：不能使用 [] 符号，如下:

代码语言：javascript复制

title: [读书笔记]《Neural Networks and Deep Learning》 - 2

如上，就会报此错

自定义主题

Hexo v5.0 ( ) Next v8.0.0 ( ) 参考：

• Custom Files | NexT
• Injects | NexT

Hexo根目录/_config.next.yml

代码语言：javascript复制

# Define custom file paths.
# Create your custom files in site directory `source/_data` and uncomment needed files below.
custom_file_path:
  head: source/_data/head.njk
  #header: source/_data/header.njk
  #sidebar: source/_data/sidebar.njk
  #postMeta: source/_data/post-meta.njk
  #postBodyEnd: source/_data/post-body-end.njk
  #footer: source/_data/footer.njk
  #bodyEnd: source/_data/body-end.njk
  #variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  #style: source/_data/styles.styl

取消注释掉需要自定义的部分，进行添加

按下方路径，新建 head.njk 文件

代码语言：javascript复制

Hexo根目录source_datahead.njk

以添加Live2d挂件为例， head.njk 文件 内容如下：

代码语言：javascript复制

<script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>

补充

Hexo 更新

代码语言：javascript复制

npm install hexo-cli -g --registry https://registry.npmjs.org

Hexo NexT 配置 第三方插件 使用本地, 而不是 CDN

注意: https://github.com/next-theme/plugins#debug @next-theme/plugins 与 hexo-theme-next 需安装相同版本

注意: 建议使用 npm install @next-theme/plugins@8.9.0 指定版本号的方式升级或安装, 注意查看 package-lock.json 中的版本号, 大部分 package.json 中都用的 "hexo-theme-next": "^8.7.0" 这种形式, ^ 只固定主版本号，因此下载时会选择最新的 8.x.x, 于是实际 package-lock.json 中为 8.9.0 注意:

hexo-generator-searchdb 需 1.4.0，之前 @next-theme/plugins@8.9.0 搭配 hexo-generator-searchdb@1.3.0 还是 404, 以及 console 还会报前面的 WARN 错误, 但明明版本号已经相同了; 测试 最新版 1.4.0 就没问题了

参考:

• Vendors | NexT

CDN Settings

You can specify a proper CDN provider in the vendors section in theme config file, which can make the static assets of plugins load faster.

代码语言：javascript复制

vendors:
  # The CDN provider of NexT internal scripts.
  # Available values: local | jsdelivr | unpkg | cdnjs
  # Warning: If you are using the latest master branch of NexT, please set `internal: local`
  internal: local
  # The default CDN provider of third-party plugins.
  # Available values: local | jsdelivr | unpkg | cdnjs
  # Dependencies for `plugins: local`: https://github.com/next-theme/plugins
  plugins: jsdelivr

Core Plugins

internal: local is used to set how to load the core plugins, e.g. source/js/utils.js. These plugins are loaded from your site by default, they are required by the basic functions of NexT. Set internal to jsdelivr, unpkg or cdnjs to load them from the corresponding CDN.

If your site is deployed to any free hosting service (Github, Gitlab, etc.), CDN links are recommended for core plugins. CDN usually has faster speeds and no traffic restrictions. If you are using the latest master branch of NexT, please set internal: local.

Third-party Plugins

plugins: jsdelivr is used to set how to load the third-party plugins, e.g. anime.js. Third-party plugins are loaded from jsDelivr CDN by default, because jsDelivr has the valid ICP license issued by the Chinese government, it can be accessed in China pretty well.

And we also provide other optional CDNs, including the famous UNPKG and CDNJS. These CDN providers are chosen to deliver our third-party plugins because they are fast and reliable. Set plugins to unpkg or cdnjs to load them from different CDN provider.

Particularly, if you are a Chinese blogger or most of your visits come from China, please note that the CDNJS is blocked in some parts of China, don't use it as your CDN provider. If your would like to load all third-party plugins from your site, please set plugins to local and install the @next-theme/plugins package: https://github.com/next-theme/plugins If your website is deployed in the local area network, then this will have a faster loading speed than CDN services.

Custom CDN URLs

Sometimes you may need to use other CDNs not included in the available values of vendors.plugins option. In the vendors section, you can configure the CDN URL of each library individually.

The config is in format of libname: CDN URL. The libname is the same as in the _vendors.yml file. The CDN URL will override the default one.

For example, if you want to set the CDN URL for anime, go to theme config file and add a key named anime in the vendors section, and set its value to the CDN URL of anime.js:

代码语言：javascript复制

vendors:
  # ...
  # Some contents...
  # ...
  anime: //cdn.jsdelivr.net/gh/juliangarnier/anime@latest/lib/anime.min.js

It's recommended to use the same version of the library as in _vendors.yml to avoid potential problems. And if you need other versions you need to test them first.

Remember to use the HTTPS protocol of CDN links when you enable HTTPS on your site.

jsDelivr does not only provide mirrors for the files from npm packages, but also fetch from the GitHub releases! We could use the following link to reference the js files, just as other CDNs.

代码语言：javascript复制

//cdn.jsdelivr.net/gh/user/repo@version/file

And it could automatically minify the JS and CSS files, even if you don't have the minified version. Just use the filename.min.js or the filename.min.css to replace the file above. For more information: https://www.jsdelivr.com/features

自动分类插件 hexo-auto-category

参考: - 【Hexo插件系列】日志的自动分类插件 hexo-auto-category | ESON

注意: 不建议使用, hexo g 后插件会直接修改 post.md 的 tags, categories

参考: - hexo 博客引流到公众号配置方法（亲测可用） | hoxis' blog - github博客Hexo引流到微信_death05的博客-CSDN博客_hexo 微信

Hexo 支持 PWA

参考:

• hexo博客支持pwa | foochane

Hexo 解决 GitHub Action 部署 更新于 时间 都变为 GitHub Action 部署时间

方法1: 手动更新 updated

参考:

• Post Settings | NexT

代码语言：javascript复制

post_meta:
  updated_at:
    enable: true

默认 启用, 因此只需要在 postname.md 中 添加上 updated 即可

代码语言：javascript复制

updated: 2022-01-09 18:55:31

可以在 模板文件 中加上 updated, 这样每次 hexo n 时就会有 updated

scaffolds/post.md

代码语言：javascript复制

---
title: {{ title }}
date: {{ date }}
updated: {{ date }}
tags:
categories:
description: {{ title }}
---

方法2: 在生成前添加下面这步来将文件的修改日期更正为该文件最后一次 commit 时的时间

region 时区问题 注意: 此方法发现 bug git log 的时间戳是 UTC 8, 但 touch -d 时，是按 标准 UTC 写的，因此导致具体时间不对

解决: 经过偶然测试, 发现通过设置时区即可

代码语言：javascript复制

- name: Build 


	

cdn hexo github javascript git 


	




	
 0 人点赞