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

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

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

F12报错

Uncaught ReferenceError: jQuery is not defined

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

这时候，往往有几个方面的原因：

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

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

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

那么解决办法也就有了：

方法一

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

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

方法二

设置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

后续问题

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

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