Se stai usando jQuery, Angular JS, o semplice vecchio JavaScript e ottieni “Uncaught ReferenceError: $ non è definito” errore che significa $ è o una variabile o un metodo che stai cercando di usare prima di dichiararlo usando la parola chiave var. In jQuery, è un nome breve della funzione jQuery() e più comunemente usato in $(document).ready(function()). Se stai facendo delle cose jQuery quando DOM è caricato e ottieni questo errore significa che il tuo browser ha un problema nel caricare la libreria jQuery da internet o dal file system locale.
In questo articolo, vedrai alcune delle ragioni più comuni per l’errore “Uncaught ReferenceError: $ non è definito” e come risolverle, ma prima di questo impariamo alcune nozioni di base sul temuto Uncaught ReferenceError: $ non è definito.
E, se vuoi imparare il JavaScript moderno o migliorare le tue abilità, ti suggerisco di iscriverti a The Complete JavaScript Course: Build Real Project di Jonas Scmedtmann su Udemy. È uno dei corsi migliori e alla mano per imparare ES 6 e altre nuove caratteristiche di Javascript.
Una delle ragioni comuni di tale errore è iniziare direttamente con jQuery senza conoscere i fondamenti di JavaScript. Ho visto molti sviluppatori web che provengono da Java, C#, HTML e Python iniziare ad usare jQuery senza sapere molto di JavaScript.
Se ti capita di lavorare nello stesso scenario, ti consiglio vivamente di leggere almeno uno dei buoni libri JavaScript per principianti, ad esempio Head First JavaScript. Ricordate sempre che jQuery è una libreria costruita su JavaScript, una volta che conoscete JavaScript, è molto più facile risolvere qualsiasi errore di jQuery.
Uncaught ReferenceError: X non è definito
Siccome JavaScript viene eseguito all’interno del browser, il vostro browser come Firefox, Chrome, Edge o Internet Explorer lancia questo errore quando state usando una variabile che non è definita, per esempio, il seguente codice lancerà questo errore, ma una volta che dichiarate la variabile usando la parola chiave var, l’errore andrà via:
data; // ReferenceError: data is not definedvar data;data; // Niente più errori
Similmente, se si accede a un metodo prima di dichiararlo si otterrà questo errore come mostrato di seguito:
process(); // ReferenceError : process is not definedprocess = function(){};process(); // Nessun errore
Ora che avete imparato quando il browser lancia Uncaught ReferenceError: $ non è definito, è il momento di guardare alcune ragioni comuni per cui questo errore si verifica quando si usa jQuery, AngularJS o altre librerie JavaScript che usano $ come scorciatoia.
<script src="/lib/jquery.plugin.js"></script><script src="/lib/jquery.min.js"></script>
Soluzione: Includere il file jquery.js prima di qualsiasi file di plugin jQuery.
<script src="/lib/jquery.min.js"></script><script src="/lib/jquery.plugin.js"></script>
2) Il secondo motivo più comune per ottenere “ReferenceError: $ non è definito” in jQuery è dovuto al percorso errato, o è un errore di battitura o il file jQuery è spostato in qualche altra posizione, il browser non è in grado di caricare il file jQuery.
Una soluzione a questo problema è semplicemente fissare il percorso della libreria jQuery. Se stai scaricando jQuery da CDN allora puoi anche usare il file jQuery ospitato da Google, che è quasi sempre disponibile.
3) Un altro bizzarro ma comune motivo di “ReferenceError: $ non è definito” in jQuery” è che potresti lavorare offline ma caricare jQuery da internet. È uno degli errori stupidi che ogni sviluppatore web fa prima o poi. La soluzione è semplice, connettersi a internet o utilizzare una copia locale della libreria jQuery come mostrato di seguito:
<script src="/js/jquery.min.js"></script>