Hallo,
<script src="js/vendor/yepnope.1.5.4-min.js"></script>
<script src="js/yepnope.init.js"></script>
> und in der yepnope.init.js möchte ich 2 Javascript-Dateien laden: jquery-1.11.0.min.js und main.js
Wieso verwendest du Yepnope auf diese Weise? Hier werden zwei Scripte asynchron geladen und synchron ausgeführt, dann werden zwei weitere Scripte asynchron geladen und synchron ausgeführt. Wenn du dir in dem Fall yepnope sparst, müssen nur zwei Ressourcen geladen werden. Yepnope bieten bei diesem Setup nur Nachteile.
Die Scripte am Ende des bodys zu laden, ist immer noch das einfachste und beste:
~~~html
<body>
<!-- Inhalt -->
<script src="js/vendor/jquery-1.11.0.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>
Verbessern kann man das höchstens dadurch, dass man alle Scripte in eine Ressource bündelt.
Yepnope ist sinnvoll, wenn man fallweise Scripte nachladen will. Für das Laden von jQuery + Main-Datei ohne tatsächliche Feature-Tests ergibt Yepnope wenig Sinn.
yepnope([{
load: ['js/vendor/jquery-1.11.0.min.js', 'js/main.js'] ,
callback: {
"jquery-1.11.0.min.js": function () {
console.log("jquery loaded!");
},
"main.js": function () {
console.log("main loaded!");
}
}
}]);
Die URLs müssen identisch und vollständig sein, dann funktioniert es in meinen Tests:
~~~javascript
yepnope({
load: ['js/vendor/jquery-1.11.0.min.js', 'js/main.js'] ,
callback: {
'js/vendor/jquery-1.11.0.min.js': function() { … },
'js/main.js': function() { … }
}
});
Wenn du die URLs nicht zweimal ausschreiben willst, verwende die Object-Notation, um einen Kurznamen zu verwenden:
yepnope({
load: {
jquery: 'js/vendor/jquery-1.11.0.min.js',
main: 'js/main.js'
},
callback: {
jquery: function() { … },
main: function() { … }
}
});
Beide Ressourcen werden korrekt geladen, in der Konsole erscheint aber nur die Meldung "jquery loaded!".
Es wundert mich, dass yepnope überhaupt den ersten Callback aufruft! Logisch ist das nicht.
Mathias