Recibo muchos errores en Sentry que dicen que "ReferenceError: jQuery no está definido", pero aún ocurre muy raramente en comparación con el número total de cargas de página.
<script src="/js/compiled/jquery.min-2fe08f7.js" defer></script> <script src="/js/my-script-e6f35a4.js" defer></script>Donde my-script.js es algo como:
(function($) { $('h1').text('Hello world'); })(jQuery);pero no tengo idea del informe de Sentry por qué no se cargó jQuery.
Las únicas pistas dadas en las migas de pan de Sentry son bastante inútiles:
12:15:25 sentry ReferenceError: jQuery is not defined 12:15:25 sentry ReferenceError: jQuery is not defined 12:15:26 exception ReferenceError: jQuery is not definedLos scripts diferidos deben cargarse en el orden en que están presentes en el documento, por lo que no creo que el problema esté en la carga asíncrona.
¿Quizás el tiempo de espera de carga del archivo jQuery en algunos dispositivos lentos? o el archivo no estaba disponible en el servidor en algún momento?
Esto me pasa en varios archivos JS y también con varias dependencias, no solo jQuery. ¿Alguien puede aconsejarme cómo resolver correctamente este problema, o al menos obtener una salida completa de la consola para Sentry, incluidas las subsolicitudes HTTP fallidas a recursos como archivos JS, para averiguar cuál es la causa real?
Gracias por adelantado.
Desea envolver su código en un controlador de eventos que se activa solo una vez que todo el DOM está listo para garantizar que se ejecute después de que se hayan cargado todos los scripts diferidos.
Por lo general, si jQuery estuviera disponible, sería una llamada $(document).ready() , pero dado que eso no está garantizado, sugeriría hacer algo como esto en su archivo my-script.js
document.addEventListener("DOMContentLoaded", function(event) { (function($) { $('h1').text('Hello world'); })(jQuery); });