jQuery is not defined|WordPress5.6でJSエラー(Autoptimize)

ウェブ制作

本ページはアフィリエイトプログラムを利用しています

WordPress5.6にアップグレード。
するとおやおや、javascriptのエラーが発生。

コンソールに出力されているエラーは「jQuery is not defined」。
jQuery本体が読み込まれていない様子です。

WordPress5.5からjQueryに変更が入っているようで。
その辺りが原因かな……と調べてみたところ、プラグインの「Autoptimize」が関係している模様。

結果として、WordPress5.6になってjQueryのファイル名が変更となっていたのが原因
これまではjquery.jsだったのがjquery.min.jsとなっていました。

Autoptimizeでは、ファイル名指定でjsを圧縮から外すことができます。
この指定から漏れたことで、jquery.min.jsまで圧縮されてjQueryが機能しなくなった形です。

jQuery is not defined|WordPress5.6に更新したらjavascriptエラーが発生

個人のブログなど、WordPressで運用しているサイトは自動アップグレードしています。
そんなこんなで、WordPress5.6にも更新されたわけですが。

その直後から、閲覧数をカウントするプラグインなどが動かなくなりました。

表示側で確認してみると、コンソールにスクリプトエラーが。
「jQuery is not defined」との内容なので、jQuery自体が読み込まれていない様子。

WordPress5.6からjQueryのファイル名が変更に…プラグインAutoptimizeを使っている場合は注意!

諸々調べたところ、下記のフォーラムの書き込みを発見。

jQuery is not defined after updating to WordPress 5.6
jQuery is not defined after updating to WordPress 5.6 Resolved eltarny (@eltarny) 3 years, 5 months ago Hello, One of my...

同じ現象だったので読み進めていると、下記コメントが答えになりました。

aha, found it; 5.6.0 changes the filename of jQuery, so you’ll have to change js/jquery/jquery.js into js/jquery/jquery.min.js ..

WordPress5.6からjQueryのファイル名が変更になっていたようです。
これまではjquery.jsでしたが、jquery.min.jsとなっています。

私が運用しているWordPressサイトではプラグインのAutoptimizeを使っています。
HTMLやCSS・JSなどを圧縮したり結合したりすることで、表示スピードを上げるなどの恩恵を受けられます。

そのAutoptimizeですが、設定で特定のjavascriptを処理から除外できます。
jQueryなんかは圧縮したり結合すると動かなくなるため、「Autoptimizeからスクリプトを除外」の入力欄にこれまではjquery.jsを記述していました。

これが、WordPress5.6からjQueryのファイル名が変更になってしまったので……。

jquery.min.jsを除外するスクリプトに追加してやります。

この設定で、スクリプトエラーは解消。
WordPressのアップグレード前と同じように、想定通りの動作となりました。

WordPress の jQuery は5.5、5.6、5.7の3回のリリースにわたって更新されます。このプロセスの中間点に到達した今、更新テストプラグインを実行して事前にサイトでのエラーを確認してください。

スライダーが動かない、ボタンの動きがおかしいなどサイトの見た目で問題がある場合は jQuery Migrate プラグインをインストールしてください。

こんな通知もされていますからね、5.7系のアップグレード時も気をつけたほうが良さそうですね。

 

オススメ
アイテム

jQuery最高の教科書

コメント

タイトルとURLをコピーしました