StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>A few things to try:</p> <p>Your define function needs to have an array as the first argument, since this is where you specify any module dependencies for this module. If your module does not require any other scripts or modules to work, then this array is left empty like so:</p> <pre class="lang-js prettyprint-override"><code>define([], function(){ //Your code here }); </code></pre> <p>Now this is the slightly confusing part, since the way RequireJS works is that it uses the module path as the module name. This is really powerful since it makes your module highly portable, but also makes the act of specifying the module you need and where it is located the same thing. </p> <p>So if the module defined above was located at "mymodule/js/component.js" you would be able to load it and use it asynchronously in another script like so:</p> <pre><code>//some existing script that then needs a JS module that has not been loaded yet require(['mymodule/js/component'], function(component){ //All loaded modules are provided as arguments in the //order they are specified in the require array var a = component(); }); </code></pre> <p>So your example becomes the following:</p> <pre><code>//This script located at mymodule/js/loadImage.js if (typeof define === 'function' && define.amd) { define([], function () { return loadImage; }); } else { $.loadImage = loadImage; } //Script located in another file that needs the loadImage module require(['mymodule/js/loadImage'], function(loadImage){ loadImage(); }); </code></pre> <p>As a final note, you can give your modules short snappy names if you like by specifying the name as the first argument of the define call. This isnt that recommended since you will need to specify the path to the file the first time you need it since RequireJS wont know where it is from just a short name. Places where this is suitable is when you are loading all your scripts up front instead of as and when they are needed (which is recommended since everything is loaded on demand). But nonetheless here is how you specify a "short" name for module:</p> <pre><code>//This script located at mymodule/js/loadImage.js if (typeof define === 'function' && define.amd) { define("loadImage", [], function () { return loadImage; }); } else { $.loadImage = loadImage; } </code></pre> <p>If you KNOW that the loadImage module has been loaded, the above technique allows you to do the following:</p> <pre><code>//Even if loadImage has been already fetched, this is good practice since you can //add more modules to be the dependency array if you need require(['loadImage'], function(loadImage){ loadImage(); }); //or sometimes this can be convenient: var loadImage = require("loadImage") loadImage(); </code></pre> <h2>UPDATE</h2> <p>Forgot to mention that if you ever wanted to create a module that needed the loadImage module to function, you would do it like so:</p> <pre><code>//By providing the module dependencies in the first argument, RequireJS will //fetch it and load it if needed define(['mymodule/js/loadImage'], function(loadImage){ loadImage(); }) </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload