jqueryバージョンを更新する


24

WordPressバージョン4.7.2を実行しています。jQueryバージョン1.12を使用します。このバージョンをより高いバージョンに更新する必要があります。以前に新しいバージョンに置き換えましたが、WordPressコアをアップグレードすると再び1.12に置き換えられます。WordPressが永続的に使用するjQueryのバージョンを変更するにはどうすればよいですか?

回答:


29

警告:特に管理パネルでは、コアjQueryバージョンを置き換えないでください。多くのWordPressコア機能はバージョンに依存する可能性があるためです。また、他のプラグインはjQueryコアに追加されたバージョンに依存する場合があります。

コアjQueryバージョンを変更することが確実な場合は、その場合、アクティブテーマのfunctions.phpファイルに次のコードを追加できます(このためのプラグインを作成する場合はさらに良い)。

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Change the URL if you want to load a local copy of jQuery from your own server.
    wp_register_script( 'jquery', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
}
add_action( 'wp_enqueue_scripts', 'replace_core_jquery_version' );

これにより、コアjQueryバージョンが置き換えられ、代わりに3.1.1Googleのサーバーからバージョンがロードされます。

また、推奨されてませんが、次のCODE行を使用してjQueryバージョンを置き換えることwp-adminもできます。

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

この方法では、WordPressを更新した後でも、必要なバージョンをjQuery使用できます。

少し良い機能:

上記のreplace_core_jquery_version関数はjquery-migrate、WordPressコアによって追加されたスクリプトも削除します。jQueryの最新バージョンはの古いバージョンでは正しく動作しないため、これは合理的ですjquery-migrate。ただし、新しいバージョンを含めることもできますjquery-migrate。その場合は、代わりに次の関数を使用します。

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery-core' );
    wp_register_script( 'jquery-core', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
    wp_deregister_script( 'jquery-migrate' );
    wp_register_script( 'jquery-migrate', "https://code.jquery.com/jquery-migrate-3.0.0.min.js", array(), '3.0.0' );
}

テーマに違反していることがわかった場合、functions.phpからアクションを削除できますか?元のjQueryバージョンに戻りますか、それとも永続的な変更ですか?
ニック

1
wp_enqueue_scriptsアクションのコールバック関数がjQueryのみを更新し、jQueryが他の場所からエンキューされている場合、アクションを削除すると元のjQueryが復元されます。ただし、サーバーのキャッシュ設定に応じて、ブラウザーが古いCODEをキャッシュすることがあります。そのため、変更を確認するには、ブラウザーのキャッシュをクリアする必要があります。
ファヤズ

このアクションを追加する前にサイトを台無しにしないようにしたかっただけです。あなたの言ったことは正確だと感じましたが、安全にプレイしたかったのです。
ニック

1
これは明らかに永続的ではありません。この変更はCODE自体に依存するため、データベースには何も保存されません。したがって、関連するCODEを削除すると、古い状態に戻ります。
ファヤズ

3.xバージョンの移行スクリプトは、プラグイン/テーマが1.12未満のバージョンを想定している場合は機能しません。詳細はこちら:wordpress.stackexchange.com/a/244543/75495
cjbj

5

この特定の問題のプラグインを開発しました。プラグインは、フロントエンドでのみロードされるため、WordPress jQueryを混乱させません。参照:WordPress用jQueryマネージャー

なぜ別のjQuery Updater / Manager / Developer / Debuggingツールなのですか?

開発者ツールでは、jQueryやjQuery Migrateの特定のバージョンを選択できないためです。実動バージョンと縮小バージョンの両方を提供します。以下の機能をご覧ください!

frontフロントエンドでのみ実行され、WordPress admin / backendおよびWPカスタマイザーに干渉しません(互換性の理由から)。https//core.trac.wordpress.org/ticket/45130および https:// coreを参照してください 。 trac.wordpress.org/ticket/37110

j jQueryやjQuery Migrateのオン/オフを切り替えます

j 特定のバージョンのjQueryまたはjQuery Migrateをアクティブ化する

さらに多く!コードはオープンソースですので、あなたはそれを研究し、それから学び、貢献することができます。


ほぼ全員が誤ったハンドルを使用します

WordPressは実際にはjqueryではなくjquery-coreハンドルを使用します。

https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226

// jQuery
$scripts->add( 'jquery', false, array( 'jquery-core', 'jquery-migrate' ), '1.12.4' );
$scripts->add( 'jquery-core', '/wp-includes/js/jquery/jquery.js', array(), '1.12.4' );
$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '1.4.1' );

jqueryのハンドルは、負荷への単なるエイリアスですjqueryのコアjqueryの-移行

エイリアスについての詳細情報を参照してください:wp_register_script複数の識別子を?

正しい方法

以下の例では、https://code.jquery.comで公式のjQuery CDNを使用しています。また、script_loader_tagを使用して、CDN属性を追加することもできます。
次のコードを使用できます。

// Front-end not excuted in the wp admin and the wp customizer (for compatibility reasons)
// See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110
function wp_jquery_manager_plugin_front_end_scripts() {
    $wp_admin = is_admin();
    $wp_customizer = is_customize_preview();

    // jQuery
    if ( $wp_admin || $wp_customizer ) {
        // echo 'We are in the WP Admin or in the WP Customizer';
        return;
    }
    else {
        // Deregister WP core jQuery, see https://github.com/Remzi1993/wp-jquery-manager/issues/2 and https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // the jquery handle is just an alias to load jquery-core with jquery-migrate
        // Deregister WP jQuery
        wp_deregister_script( 'jquery-core' );
        // Deregister WP jQuery Migrate
        wp_deregister_script( 'jquery-migrate' );

        // Register jQuery in the head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Register jquery using jquery-core as a dependency, so other scripts could use the jquery handle
         * see /wordpress/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * /wordpress/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * /programming/39653993/what-is-diffrence-between-wp-enqueue-script-and-wp-register-script
         */
        wp_register_script( 'jquery', false, array( 'jquery-core' ), null, false );
        wp_enqueue_script( 'jquery' );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_jquery_manager_plugin_front_end_scripts' );


function add_jquery_attributes( $tag, $handle ) {
    if ( 'jquery-core' === $handle ) {
        return str_replace( "type='text/javascript'", "type='text/javascript' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'", $tag );
    }
    return $tag;
}
add_filter( 'script_loader_tag', 'add_jquery_attributes', 10, 2 );
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.