Actualizar versión de jQuery

21 feb 2017, 11:02:03
Vistas: 68.6K
Votos: 38

Ejecuto WordPress versión 4.7.2 y utiliza jQuery versión 1.12. Necesito actualizar esta versión a una más reciente. Ya la he reemplazado con una versión nueva antes, pero cuando actualizo el núcleo de WordPress, se vuelve a reemplazar con la 1.12. ¿Cómo puedo cambiar la versión de jQuery que usa WordPress de forma permanente?

0
Todas las respuestas a la pregunta 2
7
47

Advertencia: No deberías reemplazar la versión core de jQuery, especialmente en el panel de administración. Ya que muchas funcionalidades del núcleo de WordPress pueden depender de esta versión. Además, otros plugins podrían depender de la versión de jQuery incluida en el core.

Si estás seguro de que deseas cambiar la versión core de jQuery, en ese caso puedes agregar el siguiente CÓDIGO en el archivo functions.php de tu tema activo (incluso mejor si creas un plugin para esto):

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Cambia la URL si deseas cargar una copia local de jQuery desde tu propio servidor.
    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' );

Esto reemplazará la versión core de jQuery y en su lugar cargará la versión 3.1.1 desde el servidor de jQuery.

Además, aunque no es recomendado, puedes usar la siguiente línea adicional de CÓDIGO para reemplazar la versión de jQuery en wp-admin también:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

De esta manera, incluso después de actualizar WordPress, tendrás la versión de jQuery que deseas.

Una función ligeramente mejor:

La función replace_core_jquery_version mencionada anteriormente también elimina el script jquery-migrate agregado por el núcleo de WordPress. Esto es razonable, porque la versión más nueva de jQuery no funcionará correctamente con una versión más antigua de jquery-migrate. Sin embargo, puedes incluir una versión más reciente de jquery-migrate también. En ese caso, usa la siguiente función:

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' );
}
21 feb 2017 15:16:12
Comentarios

¿Puedes simplemente eliminar la acción de functions.php si descubres que rompe tu tema? ¿Volverá a la versión original de jQuery o es un cambio permanente?

Nick Nick
23 ago 2018 19:54:02

Si la función de callback de la acción wp_enqueue_scripts solo actualiza jQuery y jQuery se está cargando desde otro lugar, entonces eliminar la acción restaurará el jQuery original. Sin embargo, a veces los navegadores almacenan en caché el CÓDIGO antiguo, dependiendo de la configuración de caché del servidor, por lo que deberás borrar la caché del navegador después de hacer eso para ver el cambio.

Fayaz Fayaz
23 ago 2018 20:37:25

Ok, gracias, solo quería asegurarme de no arruinar mi sitio antes de agregar esta acción. Tenía la sensación de que lo que dijiste era correcto pero quería ir a lo seguro.

Nick Nick
23 ago 2018 20:39:13

Esto obviamente no es permanente, ya que este cambio depende del CÓDIGO en sí, no se guarda nada en la base de datos. Así que al eliminar el CÓDIGO relacionado se volverá al estado anterior.

Fayaz Fayaz
23 ago 2018 20:39:28

El script de migración para las versiones 3.x no funciona cuando los plugins/temas esperan una versión inferior a la 1.12. Más información aquí: https://wordpress.stackexchange.com/a/244543/75495

cjbj cjbj
24 oct 2018 16:55:51

@cjbj por supuesto que ese es el caso. Sin embargo, la pregunta era sobre deshacerse de 1.12, así que obviamente la respuesta no cubre eso.

Fayaz Fayaz
24 oct 2018 18:18:02

Lamentablemente, parece no funcionar en WordPress 5. El antiguo Jquery se descarga, pero el nuevo no se carga.

TelFiRE TelFiRE
5 mar 2020 07:18:57
Mostrar los 2 comentarios restantes
0
17

He desarrollado un plugin para este problema específico. El plugin no interfiere con jQuery de WordPress ya que solo se carga en el front-end. Ver: jQuery Manager for WordPress

¿Por qué otra herramienta más de actualización/gestión/desarrollo/depuración de jQuery?

Porque ninguna de las herramientas de desarrollo te permite seleccionar una versión específica de jQuery y/o jQuery Migrate. Proporcionando tanto la versión de producción como la minificada. ¡Mira las características a continuación!

✅ Solo se ejecuta en el front-end, no interfiere con el admin/backend de WordPress ni con el personalizador de WP (por razones de compatibilidad) Ver: https://core.trac.wordpress.org/ticket/45130 y https://core.trac.wordpress.org/ticket/37110

Activar/desactivar jQuery y/o jQuery Migrate

✅ Activar una versión específica de jQuery y/o jQuery Migrate

¡Y mucho más! El código es de código abierto, por lo que puedes estudiarlo, aprender de él y contribuir.


Casi todos usan el handle incorrecto

WordPress en realidad usa el handle jquery-core, no 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' );

El handle jquery es solo un alias para cargar jquery-core con jquery-migrate

Más información sobre alias: wp_register_script multiple identifiers?

La forma correcta de hacerlo

En mi ejemplo a continuación uso el CDN oficial de jQuery en https://code.jquery.com. También uso script_loader_tag para poder añadir algunos atributos del CDN.
Puedes usar el siguiente código:

// Front-end no se ejecuta en el admin de WP ni en el personalizador de WP (por razones de compatibilidad)
// Ver: https://core.trac.wordpress.org/ticket/45130 y 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 'Estamos en el Admin de WP o en el Personalizador de WP';
        return;
    }
    else {
        // Desregistrar jQuery core de WP, ver https://github.com/Remzi1993/wp-jquery-manager/issues/2 y https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // el handle jquery es solo un alias para cargar jquery-core con jquery-migrate
        // Desregistrar jQuery de WP
        wp_deregister_script( 'jquery-core' );
        // Desregistrar jQuery Migrate de WP
        wp_deregister_script( 'jquery-migrate' );

        // Registrar jQuery en el head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Registrar jquery usando jquery-core como dependencia, para que otros scripts puedan usar el handle jquery
         * ver https://wordpress.stackexchange.com/questions/283828/wp-register-script-multiple-identifiers
         * Primero registramos el script y luego lo encolamos, ver por qué:
         * https://wordpress.stackexchange.com/questions/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * https://stackoverflow.com/questions/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 );
1 jul 2019 22:15:53