JustNews主题更新后,网站前端报错Jquery未加载

4
(6)

好久没更新了,今天这篇还算重要吧,上来更新一波:主要解决下jquery未正常加载报错的问题,常见的报错信息为:Uncaught ReferenceError: jQuery is not defined !

JustNews主题更新后,网站前端报错Jquery未加载

最近,有人在网站询问:主题更新6.8.0后,《网站加入点击爱心,心动特效》该文章无效。经过判断,这是由于jquery未正常加载导致的。F12查看报错信息如下:

F12报错

Uncaught ReferenceError: jQuery is not defined

可以看出,这种报错都是jquery未加载导致的。这时,我首先在自己网站加载了《心动特效》代码,发现果然不生效,而且报错jquery未定义。

JustNews主题更新后,网站前端报错Jquery未加载

这时候,往往有几个方面的原因:

  • 原因一:wordpress未引用jquery,导致失效
  • 原因二:主题未引用jquery,导致失效
  • 原因三:插件问题引起的jquery未引用
  • 原因四:jquery多次引用,引起的报错问题

最终,我联想到主题最近更新了一个新功能:静态文件公共CDN加速。经过测试,发现新版justnews主题单独引入了jquery,去掉了wordpress自带的jquery功能。

如此大致定位了问题,由于主题引入了jquery,而我们又使用了Autoptimize这款插件来压缩合并js文件。该插件默认排除了wp自带的jquery的压缩合并。而并不会排除主题引入的jquery文件。

那么解决办法也就有了:

方法一

开启主题自带的“静态文件公共CDN加速”功能,这样Autoptimize插件就不会压缩合并jquery了。这是因为Autoptimize插件只会压缩你网站中的js文件,外链不会压缩合并。

JustNews主题更新后,网站前端报错Jquery未加载

依次打开网站后台,主题设置,优化加速,拉到最下面,就可以看到上图所示的设置内容。

方法二

设置Autoptimize插件js合并压缩排除目录,添加如下内容:

wp-content/themes/justnews/themer/assets/js/jquery-3.6.0.min.js

多个js目录或js文件之间用英文逗号加空格隔开,比如我的Autoptimize插件排除的js目录如下:

wp-includes/js/dist/, wp-includes/js/tinymce/, js/jquery/jquery.js, wp-content/plugins/enlighter/cache/, js/jquery/jquery.min.js, wp-content/themes/justnews/themer/assets/js/jquery-3.6.0.min.js
JustNews主题更新后,网站前端报错Jquery未加载

后续问题

以上两种方法,任选其一即可。不过,我这里推荐各位使用方法二。不太推荐开启公共源。毕竟公共源总有失效的时候,还是用自己网站服务器上的资源更为靠谱。

JustNews主题更新后,网站前端报错Jquery未加载

尤其是js和css这类,万一公共源不稳定,你的网站就会出现各种样式错乱的问题。尽管,jsDelivr公共源非常稳定。

共计6人评分,平均4

到目前为止还没有投票~

很抱歉,这篇文章对您没有用!

让我们改善这篇文章!

告诉我们我们如何改善这篇文章?

原创文章,作者:古哥,转载需经过作者授权同意,并附上原文链接:https://iymark.com/website/justnews-autoptimize-jquery.html

发表评论

登录后才能评论

评论列表(5条)

    本站APP
    本站APP
    分享本页
    返回顶部