Sto usando richiede JS e voglio sapere il metodo migliore per utilizzare una versione CDN di jQuery. Ho sentito che la versione 1.7 è "AMD", che dovrebbe aiutare ma non riesce a trovare un esempio diretto. Spero che alcuni guru di RequireJS possano darmi una mano.Sourcing di jQuery da un CDN?
risposta
jQuery 1.7 registri stesso come un modulo di AMD con il nome di 'jquery', quindi è necessario creare una mappatura per 'jQuery' utilizzando i percorsi config:
requirejs.config({
paths: {
'jquery' : 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min'
}
});
require(['jquery'], function($) {
//$ points to jQuery
});
Nota tuttavia che RequireJS carica i moduli in modo asincrono e fuori uso, quindi se avete plugin jQuery che si desidera utilizzare che non sono avvolti in define(['jquery'], function ($){ /* plugin code goes here */ });
chiamate, il plugin potrebbe eseguire prima di jQuery è caricato.
Vedere il file README del progetto require-jquery sui modi per gestire i file che dipendono da jQuery ma che non si avvolgono nelle chiamate define()
.
È possibile includerlo come dipendenza per un modulo ma è un piccolo flakey. ad esempio
define([
"order!http://code.jquery.com/jquery-1.7.min.js"
], function($) {
})
Non è così buono per 2 motivi
1) il file jquery in sé non è un modulo in modo che il $
si ottiene dalla funzione non sarà jquery
2) la Il plug-in order!
non funziona bene con le versioni di script CDN. Vedere Requirejs' order does not work with priority config and CDN dependencies
non ho avuto la possibilità di utilizzare questo in un progetto 'reale' ma perché non abbiamo ancora aggiornato, ma dalle mie prove ho trovato che il modo migliore è quello di includere jQuery in uno script tag, quindi funziona benissimo come dipendenza dai tuoi moduli. Speriamo che il seguente esempio di piccolo sarà utile:
<html>
<head>
<title>Index2</title>
<script src="../../scripts/libraries/jquery.js" type="text/javascript"></script>
<script src="../../scripts/libraries/require.js" type="text/javascript"></script>
<script type="text/javascript"">
require(
{baseUrl: 'scripts'},
['jquery'],
function (dollarSign) {
console.log(dollarSign('div').html('hi'));
});
</script>
</head>
<body>
<div>
</div>
</body>
</html>
grazie. Sotto la linea baseUrl hai ['jquery'] come è necessario sapere che ciò si riferisce allo script che hai incluso sopra? Se si riferisce all'oggetto della finestra 'jQuery' non dovrebbe essere scritto come 'jQuery' non 'jquery'? – wilsonpage
@timeDunham Ho preso in giro il tuo esempio di Fiddle qui e funziona http://jsfiddle.net/WilsonPage/BLaLq/1/ ancora non capisco dove require ottiene l'oggetto jQuery da ?! – wilsonpage
come funzionerebbe per underscore come in questo esempio: http://jsfiddle.net/WilsonPage/BLaLq/2/ – wilsonpage
@ la risposta di jrburke non funziona per me. Secondo lo RequireJS api doc, non dovresti includere l'estensione del file nel percorso. Quindi, ecco il codice di lavoro:
requirejs.config({
paths: {
'jquery': 'https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min'
}
});
require(['jquery'], function($) {
//$ points to jQuery
});
Ho un esempio funzionante su jsfiddle: http://jsfiddle.net/murrayju/FdKTn/
Correggimi se ho torto, ma penso che @jrburke sia il autore di require.js, quindi è probabile che abbia capito bene. –
Ho anche dovuto rimuovere ".js" dal mapping di configurazione dei percorsi nell'esempio sopra riportato per farlo funzionare. –
@ZachL, hai guardato il mio jsfiddle? Basta aggiungere ".js" e vedrai che non funziona.Questo potrebbe essere qualcosa che è cambiato in alcune versioni di requirejs, perché la documentazione è incoerente su quando rimuovere il '.js'. – murrayju
Prima di tutto, si tratta di raccomandare l'uso Protocol-relative URL per jQuery CDN. E in secondo luogo, utilizzare l'array in valore con CDN e le posizioni locali per caricare il file locale se CND è morto. Puoi utilizzare tanti URL di CDN che desideri. Non temere, non è necessario caricare il secondo file dal posto locale se lo si scarica con successo da CDN.
requirejs.config({
paths: {
'jquery': ['//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min', 'lib/jquery-1.10.2.min']
}
});
Sto iniziando a capire ora questo modulo malarky ora. Potresti spiegare perché il carattere di sottolineatura non viene caricato in questo esempio: http://jsfiddle.net/WilsonPage/sCFwE/7/? Posso vedere nella fonte che ha una chiamata 'define' con il nome 'underscore' alla riga 61. https://github.com/documentcloud/underscore/blob/master/underscore.js – wilsonpage
Come posso vedere facilmente cosa i moduli sono stati definiti? per esempio. 'console.log (definedModules);' – wilsonpage
@pagewil Ho rimosso ".js" dalla mappatura del percorso del underscore. I moduli non utilizzano le estensioni di file, in genere. Sembra che sia stato il colpevole: http://jsfiddle.net/unscriptable/sCFwE/44/ – unscriptable