<\/P>
Een vraag op de forums<\/A> kwam onlangs voorbij waarvan ik dacht dat ik die misschien beter in een blogpost kon uitleggen dan in een enkele reactie. Hoe migreer ik van legacy Dojo naar moderne Dojo AMD-stijl?<\/EM> Dat is een geldige vraag, en eentje waar ik mee worstelde<\/A> toen Dojo 1.7 werd uitgebracht. Je kunt terugverwijzen naar de Migreren naar 3.0<\/A> in de documentatie om een idee te krijgen van de veranderingen.<\/P><\/P>Ik denk dat mensen op dit punt bekend zijn met het feit dat dojo.declare nu een module is genaamd dojo\/_base\/_declare, maar het gebruik van AMD-delen veroorzaakt enige verwarring.<\/P><\/P>Ik denk dat een van de obstakels is om AMD echt te begrijpen. Ik had er aanvankelijk wat lastige momenten mee, omdat ik niet zeker wist wanneer ik require<\/SPAN> moest gebruiken of wanneer define<\/SPAN>, of hoe ik met modules moest werken. Mijn eerste worstelingen waren met requirejs en ik had geen mentor die me echt kon helpen, maar ik heb me door documentatie en Google-groepen heen geworsteld om het uit te zoeken, dus toen Dojo 1.7 werd uitgebracht met de AMD-loader, was ik beter voorbereid.<\/P><\/P>Laten we het terugbrengen tot de eenvoudigste vorm en wat je in de meeste voorbeelden op de ArcGIS Developers-site<\/A> zult zien.<\/P>require(["esri\/_map", "dojo\/_domReady!"], function(Map) { var map = new Map("map", { center: [-118, 34.5], zoom: 8, basemap: "topo" });});<\/PRE><\/P>Daar is de gevreesde require<\/SPAN>-methode. Als je ooit in C++\Java of vergelijkbare talen hebt gewerkt, ben je misschien bekend met de main()<\/SPAN>-functie. Dit is de functie die wordt uitgevoerd wanneer een applicatie start, het is waar het feest begint<\/EM>. De require<\/SPAN>-methode is de main-functie van AMD<\/STRONG>. Dus ergens in de ArcGIS API for JavaScript-modules die via CDN worden gedownload wanneer je het script-tag aan je pagina toevoegt, bevindt zich een JavaScript-bestand genaamd map.js<\/SPAN> in een map genaamd esri<\/SPAN> dat er zo uitziet.<\/P><\/P>define(['dependency1', 'dependency2'], function(dependency1, dependency2) { var Map; \/*magische eenhoorn dingen*\/ return Map;});<\/PRE><\/P>De require<\/SPAN>-methode zal dat bestand zoeken en asynchroon laden in je applicatie. Wanneer het laden klaar is, wordt de functie in je applicatie aangeroepen, en wordt het ding dat definieert wat een Map is (zeer existentieel<\/EM>) geretourneerd vanuit de functie. Merk op dat deze module zijn eigen afhankelijkheden heeft, en in de functie worden ze geladen in de volgorde waarin ze worden gevraagd. DIT IS BELANGRIJK. Volgorde doet ertoe<\/EM>. Deze afhankelijkheden kunnen functies of objecten zijn, of misschien strings. Hieronder staat een diagram uit mijn boek<\/A> dat je kan helpen.<\/P><\/P><\/P><\/P>In mijn boek gebruik ik een bestand genaamd run.js<\/SPAN> dat de require<\/SPAN>-methode uitvoert waarin mijn dojoConfig<\/A> wordt gedefinieerd en een main.js<\/SPAN> die daadwerkelijk begint met werken. Dat is gewoon mijn stijl, maar het is niet dé stijl.<\/P><\/P>Sommige mensen struikelen over het gebruik van main.js<\/SPAN>, en eerlijk gezegd had ik daar ook moeite mee in het begin. Een goed referentiepunt is de Advanced Modules<\/A>-tutorial van Dojo. Ik citeer het belangrijke deel onder Configuring the Loader.<\/P><\/P>main (optioneel, standaard = main.js😞) wordt gebruikt om de juiste module te ontdekken om te laden als iemand probeert het pakket zelf te require-en. Bijvoorbeeld, als je zou proberen "dojo" te require-en, dan wordt daadwerkelijk "\/_js\/_dojo\/_main.js" geladen. Omdat we deze eigenschap hebben overschreven voor het "my" pakket, als iemand "my" zou require-en, zouden ze eigenlijk "\/_js\/_my\/_app.js" laden.Als we zouden proberen "util" te require-en, wat geen gedefinieerd pakket is, zou de loader proberen "\/_js\/_util.js" te laden. Je moet altijd al je pakketten definiëren in de loader-configuratie.Hier is een voorbeeld van hoe een van mijn dojoConfigs eruit kan zien, mijn require-entrypoint.<//PRE class=
Ik denk dat mensen op dit punt bekend zijn met het feit dat dojo.declare nu een module is genaamd dojo\/_base\/_declare, maar het gebruik van AMD-delen veroorzaakt enige verwarring.<\/P>
Ik denk dat een van de obstakels is om AMD echt te begrijpen. Ik had er aanvankelijk wat lastige momenten mee, omdat ik niet zeker wist wanneer ik require<\/SPAN> moest gebruiken of wanneer define<\/SPAN>, of hoe ik met modules moest werken. Mijn eerste worstelingen waren met requirejs en ik had geen mentor die me echt kon helpen, maar ik heb me door documentatie en Google-groepen heen geworsteld om het uit te zoeken, dus toen Dojo 1.7 werd uitgebracht met de AMD-loader, was ik beter voorbereid.<\/P><\/P>Laten we het terugbrengen tot de eenvoudigste vorm en wat je in de meeste voorbeelden op de
require(["esri\/_map", "dojo\/_domReady!"], function(Map) { var map = new Map("map", { center: [-118, 34.5], zoom: 8, basemap: "topo" });});<\/PRE><\/P>Daar is de gevreesde require<\/SPAN>-methode. Als je ooit in C++\Java of vergelijkbare talen hebt gewerkt, ben je misschien bekend met de main()<\/SPAN>-functie. Dit is de functie die wordt uitgevoerd wanneer een applicatie start, het is waar het feest begint<\/EM>. De require<\/SPAN>-methode is de main-functie van AMD<\/STRONG>. Dus ergens in de ArcGIS API for JavaScript-modules die via CDN worden gedownload wanneer je het script-tag aan je pagina toevoegt, bevindt zich een JavaScript-bestand genaamd map.js<\/SPAN> in een map genaamd esri<\/SPAN> dat er zo uitziet.<\/P><\/P>define(['dependency1', 'dependency2'], function(dependency1, dependency2) { var Map; \/*magische eenhoorn dingen*\/ return Map;});<\/PRE><\/P>De require<\/SPAN>-methode zal dat bestand zoeken en asynchroon laden in je applicatie. Wanneer het laden klaar is, wordt de functie in je applicatie aangeroepen, en wordt het ding dat definieert wat een Map is (zeer existentieel<\/EM>) geretourneerd vanuit de functie. Merk op dat deze module zijn eigen afhankelijkheden heeft, en in de functie worden ze geladen in de volgorde waarin ze worden gevraagd. DIT IS BELANGRIJK. Volgorde doet ertoe<\/EM>. Deze afhankelijkheden kunnen functies of objecten zijn, of misschien strings. Hieronder staat een diagram uit
In mijn boek gebruik ik een bestand genaamd run.js<\/SPAN> dat de require<\/SPAN>-methode uitvoert waarin mijn
Hier is een voorbeeld van hoe een van mijn dojoConfigs eruit kan zien, mijn require-entrypoint.<//PRE class=
Its useful for beginners trying to learn how to develop in JS. But it will be more useful if u put some simple examples about how to modularize ur apps properly, how to call functions from another js,etc.
I have to agree with Evelyn. Technically, my code uses AMD. But it's all still in one big file, because I can't figure out how to separate it out. Every person who posts about AMD and modules. provides the same few links - to ESRI and to DOJO documentation. I have read all of these dozens of times, but I just don't get how it applies to my work. I get the core concepts, but applying it to my existing code is a completely different story.
yes, Agree with Tracy.
There has to be a baby crawl steps guide .
I would pull out one thing and try to add it to a stand alone file.
1. Start by creating the dojoConfig file in the example above if you don't have one, and adding a script tag in your huge file to reference it.
2. Change the packages line to just one package, and create a location for it in your base root. Packages could look like this: packages: [ { name: 'whatYouReferenceYourModuleWith', location: locationPath + 'folderNameAtYourRoot', main: 'fileNameInAformentionedFolderName} ]
3. Create said folder and .js file referenced above.
4. In file in step 3, add this code: define(function() { return { lookAtMeNow: function() { return 'oh hi'; } } });
5. In your one huge file, add this somewhere (somewhere that you know the DOM is read ... through jquery, dojo, whatever): require(['whatYouReferenceYourModuleWith'], function (whatYouReferenceYourModuleWith) { alert(whatYouReferenceYourModuleWith.lookAtMeNow) } });
In short,
1. Config file makes the modules available
2. Create a package that points to one of your files
3. Create a js file that your config points to
4. define some code for that module
5. require the module defined in step 4 by the name provided in step 2. Note: leaving off the main: 'moduleName' in the package will cause the config to look for main.js (which is what was in the original post).
disclaimer: That's as baby stepped as it can be, pretty much, and I didn't test that actual syntax.
Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
