3 formas de resolver en jQuery - Uncaught ReferenceError: $ is not defined Error

En esta ocasion en tutoriales en linea les mostraremos 3 formas de resolver en jQuery - Uncaught ReferenceError: $ is not defined Error

Si está utilizando jQuery, Angular JS o jаvascript antiguo y obtiene el error Uncaught ReferenceError: $ is not defined Error, lo que significa que $ es una variable o un método que está tratando de usar antes de declararlo usando la palabra clave var. En jQuery, es un nombre corto de la función jQuery() y se usa más comúnmente en $(document).ready(function()). Si está haciendo algo de jQuery cuando se carga DOM y recibe este error, significa que su navegador tiene problemas para cargar la biblioteca jQuery desde Internet o desde el sistema de archivos local.

En este tutorial, verá algunas de las razones más comunes de los errores Uncaught ReferenceError: $ is not defined Error y cómo resolverlos, pero antes de eso, aprendamos algunos conceptos básicos sobre el temido Error.

Una de las razones comunes de dicho error es comenzar directamente con jQuery sin conocer los fundamentos de jаvascript. He visto a muchos desarrolladores web que provienen de Java, C#, HTML y Python comenzar a usar jQuery sin saber mucho sobre jаvascript.

Si trabaja en el mismo escenario, le recomiendo que lea al menos uno de los buenos libros de jаvascript para principiantes como Head First jаvascript. Recuerde siempre que jQuery es una biblioteca construida en jаvascript, una vez que conoce jаvascript, es mucho más fácil solucionar cualquier error de jQuery.

Uncaught ReferenceError: $ is not defined Error

Dado que jаvascript se ejecuta dentro del navegador, su navegador como Firefox, Chrome, Edge o Internet Explorer arroja este error cuando está usando una variable que no está definida, por ejemplo, el siguiente código arrojará este error, pero una vez que declare la variable usando la palabra clave var, el error desaparecerá:

data; // ReferenceError: data is not defined
var data;
data; // No more errors

De manera similar, si accede a un método antes de declararlo, obtendrá este error como se muestra a continuación:

process(); // ReferenceError : process is not defined
process = function(){};
process(); // No errors

Ahora que ha aprendido cuándo arroja el navegador Uncaught ReferenceError: $ is not defined Error, es hora de ver algunas razones comunes por las que ocurre este error al usar jQuery, AngularJS u otra biblioteca de jаvascript que usa $ como directo.

1 - Una de las razones más comunes de Uncaught ReferenceError: $ is not defined Error en la aplicación basada en jQuery es que el complemento jQuery se incluye antes del archivo jQuery. Dado que el complemento jQuery usa $, arroja "ReferenceError: $ is not defined" si no lo encuentra, lo cual es lógico porque jQuery no se cargó hasta entonces.

<script src="/lib/jquery.plugin.js"></script>
<script src="/lib/jquery.min.js"></script>

Solución: Incluya el archivo jquery.js antes de cualquier archivo de complemento jQuery.

<script src="/lib/jquery.min.js"></script>
<script src="/lib/jquery.plugin.js"></script>

2 - La segunda razón más común de obtener "ReferenceError: $ is not defined" en jQuery se debe a la ruta incorrecta, ya sea un error tipográfico o el archivo jQuery se movió a otra ubicación, el navegador no puede cargar el archivo jQuery .

Una solución a este problema es simplemente corregir la ruta a la biblioteca jQuery. Si está descargando jQuery desde CDN, también puede usar el archivo jQuery alojado en Google, que casi siempre está disponible.

3 - Otra razón extraña pero común de "Uncaught ReferenceError: $ is not defined Error" en jQuery "es que podría estar trabajando sin conexión pero cargando jQuery desde Internet. Es uno de los errores tontos cada web el desarrollador lo hace en algún momento u otro. La solución es simple, conéctese a Internet o use una copia local de la biblioteca jQuery como se muestra a continuación:

<script src="/js/jquery.min.js"></script>

Eso es todo acerca de cómo corregir el "Uncaught ReferenceError: $ is not defined Error" en jQuery . Puede seguir un enfoque similar a cualquier otra biblioteca de jаvascript que use $ como directo. La mayoría de los casos mencionados aquí también se aplican a bibliotecas comunes como AngularJS y otras.