Valine问题踩坑

关于自己碰到Valine评论问题的记录

Valine的配置在之前的博文里面有讲到过,这里提一下在写博文时候发现的一个笔者给自己挖的坑。

问题

在写通过Github Pages搭建Hexo(二)这篇博文的时候,Valine的block无法正常加载(具体的表现就是下面的评论区无法加载出来)。

观察

一开始笔者认为,这个是由于各个插件组件相互冲突导致的,于是笔者通过Google的方法了解到了Valine会和LeanCloud的阅读次数以及pjax这两个插件有所冲突。但是在周详地检查过各个issue提出的解决方法后,笔者发现自己根本就没有启用除了Valine评论以外的这些功能🤦‍♂️。因此基本可以排除组件冲突的原因。

经过笔者的进一步观察发现,这个问题仅出现在通过Github Pages搭建Hexo(二)上,而不会出现在通过Github Pages搭建Hexo(一)上面,这个诡异的差别就成为了解决这个问题的关键。

于是笔者打开两篇博文页面,在Console中查看log,发现了在出问题的页面上面没有加载Valine的js,因此导致了在下面评论区的block中,Valine对象无法初始化的问题。于是问题可以基本上锁定在页面js加载这方面。

而笔者在进行了inspect elements的细致观察对比过后,发现(二)页面上缺少加载Valine的script tag,因此可以断定是某些地方发生了冲突导致该entry没有能够正常生成。

解决

在笔者苦思冥想的时候突然注意到了博文里面的一个二级标题,其内容便是Valine,而且与其对应的tag id也恰好是Valine。因此笔者尝试着改掉了该处的标题内容,结果问题成功得到了修复,评论区也能够顺利地重新加载了出来。

另一种解决思路

既然现在已经知道了这个问题的原因是id冲突,那么手动将二级标题使用h2 tag以html的格式写出来也是一个可行的workaround。

总结

所以说还是自己莫名其妙的操作把自己坑了几个小时的时间进去🤷‍♂️。介于这个也算不上什么bug,所以也没有去GitHub下面反馈的想法。就此留下这篇记录供以后遇到类似问题的人参考吧。