This page (revision-5) was last changed on 05-Mar-2020 17:51 by Dieter Käppel

This page was created on 05-Mar-2020 17:11 by Dieter Käppel

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note
5 05-Mar-2020 17:51 4 KB Dieter Käppel to previous
4 05-Mar-2020 17:51 3 KB Dieter Käppel to previous | to last
3 05-Mar-2020 17:27 3 KB Dieter Käppel to previous | to last
2 05-Mar-2020 17:25 2 KB Dieter Käppel to previous | to last
1 05-Mar-2020 17:11 1 KB Dieter Käppel to last

Page References

Incoming links Outgoing links

Version management

Difference between version and

At line 40 changed one line
css: "js/require-css"
requirejs.config({
paths: {
css: "js/require-css"
}
});
At line 43 changed one line
Die require.css kann wie folgt aussehen:
Die require-css.js kann wie folgt aussehen:
At line 73 added 65 lines
!!Base URL
Möchte man den config.baseUrl berücksichtigen, wäre die theoretisch richtige Antwort:
{{{
function(name, req, onload, config) {
var url = req.toUrl(name + ".css");
}
}}}
Wie auch in verschiedenen Foren zu finden ist, legt [RequireJS] unterschiedliches Verhalten an den Tag. Vor allem im Browser entstehen dadurch offenbar falsche URLs. In eigenen Loadern lässt sich das beheben durch:
{{{
function(name, req, onload, config) {
var url = req.toUrl(config.baseUrl + name + ".css");
};
}}}
!!!Packages
Mit [RequireJS] können können komplette Projekte als Packet importiert werden:
{{{
requirejs.config({
packages: [{
name: "static-ui",
location: "/service/static-ui"
}]
});
}}}
Dabei sind folgende Dinge zu beachten:
* Es wird ein main.js in der location erwartet
* Es wird nur das define aus dem main importiert
** Untergeordnete Module werden nur im importierten Package selbst sauber geladen
** Werden dieselben Module aus dem übergeordneten Package benötigt, müssen diese dort (nochmals) definiert werden
* Packages sind kein Massen-Path-Import
* Jedes Package, egal ob übergeordnet oder untergeordnet, hat die Paths sauber zu definieren
__Erklärung:__ Aufgrund des asynchronen Ladens ist unklar, ob das Package zuerst aus dem Unterpackage oder Hauptpackage geladen wird. Wird es aus dem Unterpackage geladen, ist die Definition richtig. Wird es zuerst aus dem Hauptpackage geladen und fehlt dort die Definition, wird die Standardauflösung baseUrl/<name>.js verwendet, die möglicherweise falsch ist.
!!!JQuery
Obwohl [JQuery] mit Unterstützung für [RequireJS] kommt, installiert es die globalen Variablen $ und jQuery. Die Begründung liegt wohl in der Kompatibilität mit anderen JQuery-Modulen. Der Work-around liegt darin, [JQuery] zunächst unter anderem Namen zu laden und dann unter "jquery" zu definieren und dann mit jQuery.noConflict(true) umzudefinieren:
{{{
requirejs.config({
paths: {
"jquery-internal": "vue/js/jquery-3.4.1.min",
jquery: "vue/js/jquery-noconflict"
}
});
}}}
Mit jquery-noconflict.js:
{{{
define(["jquery-internal"], function() {
return jQuery.noConflict(true);
});
}}}
__Hinweis:__ Im Browser ist es leider nicht möglich, auf Ressourcen zuzugreifen, die nicht in "paths" definiert wurden. Ansonsten wird die absolute URL falsch zusammengesetzt.
!!!Links
* [RequireJS API|https://requirejs.org/docs/api.html]