YunYouJun / hexo-theme-yun

☁️ A fast & light & lovely theme for Hexo. 一个对可爱自以为是的 Hexo 主题。
https://yun.yunyoujun.cn
MIT License
1.39k stars 168 forks source link

[Bug Report]生成的侧边栏目录在标题级数跳跃时会有显示问题 #86

Closed gudzpoz closed 3 years ago

gudzpoz commented 3 years ago

Describe the bug 生成的侧边栏目录在标题级数跳跃时会有显示问题。

To Reproduce 如:

# h1
### h3
## h2

就会有问题: image

请见: 问题网页: https://gudzpoz.gitlab.io/posts/yun-test/ 问题源文件: https://gitlab.com/gudzpoz/gudzpoz.gitlab.io/-/blob/master/source/_posts/yun-test.md 使用的主题版本: https://github.com/YunYouJun/hexo-theme-yun/tree/ded9d34276a6e0cbe9be7ab16b6ab8a6049f6e0d

gudzpoz commented 3 years ago

新建的测试博客无法重现。我先尝试找找原因。

gudzpoz commented 3 years ago

更正:用上述 markdown 生成的目录是正常的,应使用以下 markdown 重现:

# h1
### h3
# h1

重现流程:

hexo init my-blog
cd my-blog
npm install
npm install hexo-render-pug hexo-renderer-stylus --save
git clone -b dev https://github.com/YunYouJun/hexo-theme-yun themes/yun
vim _config.yml # theme: yun
vim source/_posts/hello-world.md # 使用上述 markdown
hexo serve
YunYouJun commented 3 years ago

hexo 里新建的 post.md 是带有 front-matter,所以默认 title: xxx 就已经是一级标题了。 而 SEO 一级标题有且应当仅有一个。所以应该始终从二级标题开始使用。

您可以尝试使用 VSCode 的 markdownlint 插件,其中内置的规范同样如此。

gudzpoz commented 3 years ago

谢谢你!

---
title: Hello World
---

## h2
#### h4
## h2

## h2 之后的
## h2 全部乱了
## h2 像这样
## h2 乱了

### h3 还好
## 现在没有恢复

但其实我尝试了从 h2 开始,但是格式还是不正确。 image

在 lint 方面,的确从 h2 直接跳到 h4 是不好的书写习惯:Header levels should only increment by one level at a time。但是我对 lint 的理解是它并不是一个强制性的要求?所以如果能在标题级数跳跃时处理好或者至少在控制台弹出警告的话是不是会好一些?

YunYouJun commented 3 years ago

在 lint 方面,的确从 h2 直接跳到 h4 是不好的书写习惯:Header levels should only increment by one level at a time。但是我对 lint 的理解是它并不是一个强制性的要求?所以如果能在标题级数跳跃时处理好或者至少在控制台弹出警告的话是不是会好一些?

image

我在本地尝试了一下,实际上将 h4 修改为 h3 便可以得到正确渲染的目录。 我使用的是 hexo 中 toc 返回的 DOM 结构,而 hexo 的渲染则取决于 hexo-renderer-marked 或您安装的其他渲染器。所以主题不会针对此做提示与适配。

当然按照 lint 来写,肯定是最合适的。

gudzpoz commented 3 years ago

谢谢!是的,的确是 hexo 的问题: https://github.com/hexojs/hexo/issues/2137 。toc 返回的结构已经完全变形了。问题似乎已经存在很久了,但是还是没有修复。