HEXO打开 related_posts 推荐功能时出现编译异常
问题出现
因为刚开始写文章并未出现tags标签重合,所以并未触发推荐功能!直到昨天写一篇有重复tags标签后就发现一直报错,首先还是网上百度查找问题。
一通操作下来,都只能找到 related_posts 打开说明和设置方式,最后还是得通过故障自己解决!
问题定位如图:
1.最初点 post.pug
hexo-theme-butterfly\layout\post.pug:27
即说明是在文件 post.pug 中的函数 related_posts 出了异常,
25| include includes/pagination.pug
26| if theme.related_post && theme.related_post.enable
–27| != related_posts(page,site.posts)
28|
29| if page.comments !== false && theme.comments && theme.comments.use
30| - var commentsJsLoad = true
2.根本问题点 this.escape_html is not a function
最后问题为 related_post.js 文件下的 escape_html 函数
使用escapeHTML,将字符串转为 <script>alert(2);</script>此时,浏览器将能正确解析,因为浏览器接收到实体字符后,转成对应的尖括号等
在 hexo-theme-butterfly\scripts\helpers\related_post.js 中的 escape_html 并未定义,因此有推荐数据进来时就报错,本来想自己增加 escape_html 函数,但又报 related_posts is not a function 错误,只好作罢!
3.解决办法:不使用 escape_html 函数(再看后边不知会有啥错误)
既然返回的标题是字符串型,那就直接使用字符串测试后发现确实能通过,最后就去掉 escape_html 而直接使用。
按照说明,应该是浏览器字符串转换相关,后续看会不会因此报出什么故障了!
问题解决如图:
参考到好的文章
一、Hexo主题开发谈:制作过程如何避坑和一些经验
1.安装了hexo-browsersync之后也不能实现修改pug文件之后刷新出修改后的结果。只能实现自动刷新,但是刷新了之后还是修改前的页面。所以我找了一种办法使其能够达到预期的刷新并修改的效果,可以参考这个issue里最下面我的回答:
在你的node_modules文件夹里找到hexo-renderer-jade的文件夹,然后将里面lib/pug.js(jade同理)的其中一行代码注释掉:
// pugRender.compile = pugCompile
我初步看了一下应该是跟预编译有关系。
2. hexo-server模式下,中文文章渲染不全。可以参考这个相关issue。解决办法是在站点的(而不是主题的)_config.yml里添加如下配置:
server:
compress: true # 开启压缩
3. hexo默认的highlight渲染在未指定代码类型的时候会很慢,为了规范我们的文章书写以及提高渲染速度,我们应该在站点的配置文件里加上:
highlight:
auto_detect: false
并在写文章的时候,代码块的声明区域边上直接带上代码类型,比如:js,这样就正常了
二、转义分为escapeHTML和unescapeHTML,先看两个函数的实现。
1 | /** |