Hexo NexT 主题升级 7.4

Posted on

2019-09-12 Edited on 2020-02-14 In Hexo

Disqus: 0 Comments
Symbols count in article: 633 Reading time ≈ 2 mins.

使用 7.1.2 才过了不到 3 个月，我又将博客主题升级了，不过这次是因为 sidebar 出现了统计隐藏的样式 bug，没想到意外赶上了几个特别明显的优化。这次是真的值得所有 NexT 老用户去尝试了。

从我的体验来看，生成页面的耗时直接减半，对比 5 -> 7.1.2 版本升级的提速，效果相当可观。

定制代码注入

这个是绝对好评了！目前最常见的维护主题代码的方式就是人工 clone theme-next 到 themes/next 目录，除非 fork 一份仓库自己维护，所有定制的内容必须在 themes/next 目录修改，版本管理混在一起，一旦想升级主题，得挨个检查被自己修改过的文件。

现在可以将定制代码和原 NexT 主题代码完全隔离，自己添加的修改全都提取到 hexo 站点的 source/_data 目录下。只需要保管好 _config.yml，以后的主题更新方式就轻松地变为一键拉取最新代码。

注意需要配置开启对应的 custom_file_path，支持的模块如下，几乎全面满足定制需要。

custom_file_path:
  # 页面
  #head: source/_data/head.swig
  #header: source/_data/header.swig
  #sidebar: source/_data/sidebar.swig
  #postMeta: source/_data/post-meta.swig
  #postBodyEnd: source/_data/post-body-end.swig
  #footer: source/_data/footer.swig
  #bodyEnd: source/_data/body-end.swig
  # 样式
  #variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  #style: source/_data/styles.styl

可以参考我迁移后的扩展代码：https://github.com/Claude-Ray/claude-ray.github.io/tree/hexo/source/_data

使用 em 取代 px

扩大了自适应的范围，但我实在接受不了它在高分屏下的超大字体，没关系，上面提供的source/_data/variables.styl 可以用来重写 base.styl 中的变量。

// Font size
$font-size-large          = 1em;
$font-size-larger         = 1.125em;
$font-size-largest        = 1.25em;

// Headings font size
$font-size-headings-base  = 1.6em;

以上配置差不多就可以恢复原来的视觉效果了。

配置结构优化

关于 sidebar 位置的配置终于可以在所有主题中统一生效了，还有一些其他的简化，迁移配置的时候务必注意对照着修改。

除了以上明显的特性更新，还有一堆 bug 修复、渲染优化等等，没毛病！

这次的更新不用等了，尤其前两个优化解决了长久以来的痛点，值得升级。

Reference

Post author: Claude Ray
Post link: http://claude-ray.com/2019/09/12/hexo-theme-next-upgrade-7-4/
Copyright Notice: All articles in this blog are licensed under BY-NC-SA unless stating additionally.

# Hexo

Hexo NexT 主题升级 7.4