Disqus和velocity导致页面空白

使用Hexo NexT主题搭建的博客,突然出现页面内容空白、不可见的问题。发现同时使用Disqus和velocity时就会出现此问题(之前同时使用并未发生异常),作记录如下。

问题描述

使用的博客框架是Hexo,使用的主题是NexT。

问题表现为:博客页面内容不可见,但是内容其实存在,可以点击链接跳转(虽然看不见链接),查看网页源码也发现是有内容的。

页面存在error:

1
2
3
4
5
6
Uncaught TypeError: $(...).velocity is not a function
at menu (motion.js:295)
at Object.next (motion.js:197)
at Array.sequence.(:4000/anonymous function).o.complete (http://localhost:4000/js/src/motion.js?v=7.0.1:279:22)
at p (velocity.min.js:3)
at c (velocity.min.js:3)

具体页面表现如下:

使用chrome inspect查看,发现error如下:

问题表因

前端知识薄弱,对问题根因并不清楚,只是多方排查之后发现在同时使用Disqusvelocity时就会出现此问题。

之前也是一直在同时使用两者,并未出现该异常,估计是Disqus发生了某些变更导致的。

目前被迫采用的解决方案就是,放弃其中一个的使用,Disqus支持评论功能,velocity支持页面动画效果。因为目前还没有被评论过,就暂时先把评论功能关掉了。


更新

2019.5.28日,启用Disqus,未发生之前出现的问题。