sponsor

変更する前にバックアップすることをオススメします。

Autoptimize と Jetpack by WordPress によるエラーについて

JetpackとAutoptimizeによるエラー WP プラグイン
JetpackとAutoptimizeによるエラー
WP プラグイン
sponsor

Autoptimize と Jetpack by WordPress

CSS、HTML、JavaScriptコードを最適化するプラグイン「Autoptimize」と様々な機能を持つ「Jetpack」、両方の使用で、見た目には問題はないように見えますが、デロッパーツールでエラーが出ています。

sponsor

Autoptimize と Jetpack を利用することによるエラー

JetpackとAutoptimizeによるエラー
JetpackとAutoptimizeによるエラー

この3つのエラーはログインした状態で、デベロッパーツールを確認すると表示されるエラーで、問題ないと思われます。サイト管理者だけがわかるエラーです。

Uncaught TypeError

Uncaught TypeError: Cannot read property ‘extend’ of undefined

ReferenceError

notes-common-v2…Uncaught : Backbone is not defined
admin-bar-v2…Uncaught ReferenceError: _ is not defined

参考 WordPress Support

These errors only show up as a logged in user so I don’t care that much, but I would want to fix it if I can.

Autoptimize で「JavaScript コードの最適化」の設定した場合、ログインした状態で見るとエラーになります。

Site Kit by Google

Site Kit by Googleでも同じように、ログインした状態でデベロッパーツールを確認するとエラーが表示されます。

Uncaught SyntaxError: Unexpected token ‘+’
Uncaught SyntaxError: Invalid or unexpected token 
Uncaught SyntaxError: Invalid regular expression: missing /
Uncaught SyntaxError: missing ) after argument list
sponsor

JetPackとAsync JavaScriptAutoptimize

JetPack と Async JavaScript と Autoptimize は相性が悪いと言われています。

  • Async JavaScript(非同期JavaScript)
  • Autoptimize(CSS、JS、画像、Google フォントなどを最適化プラグイン)
  • JetPack
sponsor

Autoptimize と Jetpack を利用することによるエラー

Autoptimize で「JavaScript コードの最適化」の設定いている場合、ログインした状態で見るとエラーになりるだけなので、修正は必要ないと思いますが一応記載。

ログアウトした状態デパロッパツールで見るとエラーはない

JetpackとAutoptimizeによるエラー
JetpackとAutoptimizeによるエラー

プラグインAutoptimizeの「JavaScript コードの最適化」のチェックを外す、またはJetPackを利用しないことでログインした状態でのエラーはなくなります。

因みに非同期JavaScript の設定

非同期 JavaScript
非同期 JavaScript

非同期 JavaScriptは上の画像のように設定しています。

Async JavaScriptとAutoptimizeと高速化

Async JavaScriptとAutoptimizeを利用し高速化は重要のようです。

非同期処理と同期処理 Async JavaScriptとAutoptimizeの利用
Async JavaScriptとAutoptimizeと高速化 Async JavaScript(...
新しいタブで開く)