Zaktualizuj wersję jquery

24

Używam WordPress w wersji 4.7.2. i używa jQuery w wersji 1.12. Muszę zaktualizować tę wersję do wyższej. Zastąpiłem go wcześniej nową wersją, ale kiedy aktualizuję rdzeń WordPress, jest ponownie zastępowany 1.12. Jak mogę zmienić wersję jQuery, z której korzysta WordPress na stałe?

Siamak Ferdos
źródło

Odpowiedzi:

29

Ostrzeżenie: nie powinieneś zastępować podstawowej wersji jQuery, szczególnie w panelu administracyjnym . Ponieważ wiele podstawowych funkcji WordPress może zależeć od wersji. Również inna wtyczka może zależeć odjQuerywersji dodanej w rdzeniu.

Jeśli masz pewność, że chcesz zmienić jQuerywersję podstawową , w takim przypadku możesz dodać następujący KOD do functions.phppliku aktywnego motywu (nawet lepiej, jeśli utworzysz wtyczkę do tego):

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' );

Spowoduje to zastąpienie jQuerywersji podstawowej i zamiast tego załaduje wersję 3.1.1z serwera Google.

Ponadto, choć nie jest to zalecane , możesz użyć następującego dodatkowego wiersza KOD, aby również zastąpić wersję jQuery wp-admin:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

W ten sposób, nawet po aktualizacji WordPress, będziesz mieć wersję jQuerytaką, jak chcesz.

Nieco lepsza funkcja:

Powyższa replace_core_jquery_versionfunkcja usuwa również jquery-migrateskrypt dodany przez rdzeń WordPress. Jest to uzasadnione, ponieważ najnowsza wersja jQuery nie będzie działać poprawnie ze starszą wersją jquery-migrate. Możesz jednak dołączyć także nowszą wersję jquery-migrate. W takim przypadku użyj zamiast tego następującej funkcji:

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' );
}
Fajaz
źródło
Czy możesz po prostu usunąć akcję z functions.php, jeśli okaże się, że łamie ona Twój motyw? Czy powróci do oryginalnej wersji jQuery, czy jest to trwała zmiana?
Nick
1
Jeśli funkcja zwrotna wp_enqueue_scriptsakcji aktualizuje tylko jQuery, a jQuery jest kolejkowane z innego miejsca, wówczas usunięcie akcji spowoduje przywrócenie oryginalnego jQuery. Jednak czasami przeglądarki buforują stary KOD, w zależności od ustawień pamięci podręcznej serwera, więc po wykonaniu tej czynności trzeba wyczyścić pamięć podręczną przeglądarki, aby zobaczyć zmianę.
Fayaz
ok, dziękuję, chciałem się tylko upewnić, że nie spieprzę strony przed dodaniem tej akcji. Miałem wrażenie, że to, co powiedziałeś, jest dokładne, ale chciałem grać bezpiecznie.
Nick
1
Nie jest to oczywiście trwałe , ponieważ zmiana zależy od samego KODU, nic nie jest zapisywane w bazie danych. Usunięcie powiązanego KODU spowoduje powrót do starego stanu.
Fayaz
Skrypt migracji dla wersji 3.x nie działa, gdy wtyczki / motywy oczekują wersji poniżej 1.12. Więcej o tym tutaj: wordpress.stackexchange.com/a/244543/75495
cjbj
5

Opracowałem wtyczkę do tego konkretnego problemu. Wtyczka nie zadziera z jQuery WordPress, ponieważ jest ładowana tylko w interfejsie. Zobacz: jQuery Manager dla WordPress

Dlaczego kolejne narzędzie jQuery Updater / Manager / Developer / Debugging?

Ponieważ żadne z narzędzi programistycznych nie pozwala wybrać konkretnej wersji jQuery i / lub jQuery Migrate. Zapewniając zarówno wersję produkcyjną, jak i zminimalizowaną. Zobacz funkcje poniżej!

Executed Wykonane tylko w interfejsie użytkownika, nie koliduje z administratorem / backendem WordPressa i dostosowaniem WP (ze względu na kompatybilność) Patrz: https://core.trac.wordpress.org/ticket/45130 i https: // core. trac.wordpress.org/ticket/37110

Włącz / wyłącz jQuery i / lub jQuery Migrate

✅ Aktywuj określoną wersję jQuery i / lub jQuery Migrate

I wiele więcej! Kod jest open source, więc możesz go studiować, uczyć się na nim i wnosić wkład.


Prawie wszyscy używają niewłaściwego uchwytu

WordPress faktycznie używa uchwytu jquery-core, a nie jquery:

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 uchwyt jest tylko alias załadować jQuery rdzeń z jquery-migrować

Zobacz więcej informacji na temat aliasów: wp_register_script wielu identyfikatorów?

Właściwy sposób to zrobić

W poniższym przykładzie używam oficjalnego CDN jQuery pod adresem https://code.jquery.com. Używam także script_loader_tag, aby móc dodać niektóre atrybuty CDN.
Możesz użyć następującego kodu:

// 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 );
Remzi Cavdar
źródło