Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Because the browser is remote from its resources, it has to either block the main thread while it fetches those resources or it has to fetch them asynchronously. Since we should never block the main thread (effectively making the browser unresponsive), we have to fetch resources async. (It's the same with any AMD loader, RequireJS, dojo, etc.)</p> <p>Therefore, things like the following just can't work:</p> <pre><code>var foo = require('lib/foo'); </code></pre> <p>Well, it can't work in the usual global-ish space you may be used to in browsers. It <em>can</em>, however, work in a controlled environment such as inside an AMD module.</p> <p><strong>Step 1: write your code inside of modules.</strong></p> <p><strong>Step 2: write a bootstrap module to launch your app.</strong></p> <pre><code>&lt;script src="lib/curl/src/curl.js"&gt;&lt;script&gt; &lt;script src="myapp/run.js"&gt;&lt;script&gt; </code></pre> <p>Inside run.js:</p> <pre><code>// curl 0.7.x requires a named module here ('myapp/run') define('myapp/run', ['curl'], function (curl) { curl.config( baseUrl: '', packages: [ /* configure your 3rd-party packages */ ], paths: { /* configure any non-package 3rd-party libs here */ }, preloads: [ /* put modules that *must* be loaded first here (e.g. shims) */ ], main: 'myapp/main' }); }); </code></pre> <p>"myapp/main" could then look something like this:</p> <pre><code>define(function (require) { var view1 = require('myapp/view1/controller'); view1.render(); view1.placeAt('body'); }); </code></pre> <p>Inside the main module (or any AMD module), the <code>require</code> acts more like I think you're expecting. Note that this is a special AMD signature. You can't specify dependencies in the <code>define</code> and expect the <code>require</code> to behave like this. You have to specify your dependencies in <em>only</em> one way. This will not work:</p> <pre><code>define(['myapp/view1'], function (view1) { var foo = require('foo'); }); </code></pre> <p>Hope this helps. </p> <p>-- John</p>
 

Querying!

 
Guidance

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