web-apps/vendor/requirejs/docs/errors.html

256 lines
14 KiB
HTML
Raw Normal View History

2016-03-11 00:48:53 +00:00
<div id="directory" class="section">
<h1>Common Errors</h1>
<ul class="index mono">
<li class="hbox"><a href="#mismatch">Mismatched anonymous define() modules ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 1</span></li>
<li class="hbox"><a href="#timeout">Load timeout for modules: ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 2</span></li>
<li class="hbox"><a href="#defineerror">Error evaluating module ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 3</span></li>
<li class="hbox"><a href="#notloaded">Module name ... has not been loaded yet for context: ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 4</span></li>
<li class="hbox"><a href="#requireargs">Invalid require call</a><span class="spacer boxFlex"></span><span class="sect">&sect; 5</span></li>
<li class="hbox"><a href="#nodefine">No define call for ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 6</span></li>
<li class="hbox"><a href="#scripterror">Script error</a><span class="spacer boxFlex"></span><span class="sect">&sect; 7</span></li>
<li class="hbox"><a href="#interactive">No matching script interactive for ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 8</span></li>
<li class="hbox"><a href="#pathnotsupported">Path is not supported: ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 9</span></li>
<li class="hbox"><a href="#sourcemapcomments">Cannot use preserveLicenseComments and generateSourceMaps together</a><span class="spacer boxFlex"></span><span class="sect">&sect; 10</span></li>
<li class="hbox"><a href="#importscripts">importScripts failed for ...</a><span class="spacer boxFlex"></span><span class="sect">&sect; 11</span></li>
</ul>
<p>This page lists errors that are generated by RequireJS. If the following information does not fix the problem, you can ask on the <a href="https://groups.google.com/group/requirejs">RequireJS list</a> or <a href="https://github.com/jrburke/requirejs/issues">open an issue</a>. In either case it is best to have an example or detailed explanation of the problem, hopefully with steps to reproduce.</p>
</div>
<div class="section">
<h2><a name="mismatch">Mismatched anonymous define() modules ...</a><span class="sectionMark">&sect; 1</span></h2>
<p>If you manually code a script tag in HTML to load a script with an anonymous define() call, this error can occur.</p>
<p>Also seen if you manually code a script tag in HTML to load a script that has a few named modules, but then try to load an anonymous module that ends up having the same name as one of the named modules in the script loaded by the manually coded script tag.</p>
<p>Finally, if you use the loader plugins or anonymous modules (modules that call define() with no string ID) but do not use the RequireJS optimizer to combine files together, this error can occur. The optimizer knows how to name anonymous modules correctly so that they can be combined with other modules in an optimized file.</p>
<p>To avoid the error:</p>
<ul>
<li>Be sure to load all scripts that call define() via the RequireJS API. Do not manually code script tags in HTML to load scripts that have define() calls in them.</li>
<li>If you manually code an HTML script tag, be sure it only includes named modules, and that an anonymous module that will have the same name as one of the modules in that file is not loaded.</li>
<li>If the problem is the use of loader plugins or anonymous modules but the RequireJS optimizer is not used for file bundling, use the RequireJS optimizer.</li>
</ul>
</div>
<div class="section">
<h2><a name="timeout">Load timeout for modules: ...</a><span class="sectionMark">&sect; 2</span></h2>
<p>Likely causes and fixes:</p>
<ul>
<li>There was a script error in one of the listed modules. If there is no script error in the browser's error console, and if you are using Firebug, try loading the page in another browser like Chrome or Safari. Sometimes script errors do not show up in Firebug.</li>
<li>The path configuration for a module is incorrect. Check the "Net" or "Network" tab in the browser's developer tools to see if there was a 404 for an URL that would map to the module name. Make sure the script file is in the right place. In some cases you may need to use the <a href="api.html#config">paths configuration</a> to fix the URL resolution for the script.</li>
<li>The paths config was used to set two module IDs to the same file, and that file only has one anonymous module in it. If module IDs "something" and "lib/something" are both configured to point to the same "scripts/libs/something.js" file, and something.js only has
one anonymous module in it, this kind of timeout error can occur. The fix is to make sure all module ID references use the same ID (either choose "something" or "lib/something" for all references), or use <a href="api.html#config-map">map config</a>.</li>
</ul>
</div>
<div class="section">
<h2><a name="defineerror">Error evaluating module ...</a><span class="sectionMark">&sect; 3</span></h2>
<p>An error occured when the define() function was called for the module given in the error message. It is an error with the code logic inside the define function. The error could happen inside a require callback.</p>
<p>In Firefox and WebKit browsers, a line number and file name will be indicated in the error. It can be used to locate
the source of the problem. Better isolation of the error can be done by using a debugger to place a
breakpoint in the file that contains the error.</p>
</div>
<div class="section">
<h2><a name="notloaded">Module name ... has not been loaded yet for context: ...</a><span class="sectionMark">&sect; 4</span></h2>
<p>This occurs when there is a require('name') call, but the 'name' module has not been loaded yet.</p>
<p>If the error message includes <strong>Use require([])</strong>, then
it was a top-level require call (not a require call inside a define() call) that should be using the async, callback version of require to load the code:</p>
<pre><code>//If this code is not in a define call,
//DO NOT use require('foo'), but use the async
//callback version:
require(['foo'], function (foo) {
//foo is now loaded.
});
</code></pre>
<p>If you are using the simplified define wrapper, make sure you have <strong>require</strong> as the first argument to the definition function:</p>
<pre><code>define(function (require) {
var namedModule = require('name');
});
</code></pre>
<p>If you are listing dependencies in the dependency array, make sure that <strong>require</strong> and <strong>name</strong> are in the dependency array:</p>
<pre><code>define(['require', 'name'], function (require) {
var namedModule = require('name');
});
</code></pre>
<p>In particular, <strong>the following will not work</strong>:</p>
<pre><code>//THIS WILL FAIL
define(['require'], function (require) {
var namedModule = require('name');
});
</code></pre>
<p>This fails because requirejs needs to be sure to load and execute all dependencies
before calling the factory function above. If a dependency array is given to define(),
then requirejs assumes that all dependencies are listed in that array, and it will
not scan the factory function for other dependencies. So, either do not pass in the dependency array, or if using the dependency array, list all the dependencies in it.</p>
<p>If part of a require() callback, all the dependencies need to be listed in the array:</p>
<pre><code>require(['require', 'name'], function (require) {
var namedModule = require('name');
});
</code></pre>
<p>Be sure that <strong>require('name')</strong> only occurs inside a define() definition function or a require() callback function, never in the global space by its own.</p>
<p><strong>In the RequreJS 1.0.x releases</strong>, there <a href="https://github.com/jrburke/requirejs/issues/265">is a bug</a> with having a space between the require and parens in WebKit browsers when using the simplified CommonJS wrapping (no dependency array):</p>
<pre><code>define(function (require) {
//Notice the space between require and the arguments.
var namedModule = require ('name');
});
</code></pre>
<p>The workaround is to just remove the space. This is fixed in the 2.0 code, and may be backported to the 1.0.x series if a 1.0.9 release is done.</p>
</div>
<div class="section">
<h2><a name="requireargs">Invalid require call</a><span class="sectionMark">&sect; 5</span></h2>
<p>This occurs when there is a call like:</p>
<pre><code>require('dependency', function (dependency) {});
</code></pre>
<p>Asynchronously loading dependencies should use an array to list the dependencies:</p>
<pre><code>require(['dependency'], function (dependency) {});
</code></pre>
</div>
<div class="section">
<h2><a name="nodefine">No define call for ...</a><span class="sectionMark">&sect; 6</span></h2>
<p>This occurs when <a href="api.html##config-enforceDefine">enforceDefine is set to true</a>, and a script that is loaded either:</p>
<ul>
<li>Did not call define() to declare a module.</li>
<li>Or was part of a <a href="api.html#config-shim">shim config</a> that specified
a string <code>exports</code> property that can be checked to verify loading, and that check failed.</li>
<li>Or was part of a <a href="api.html#config-shim">shim config</a> that did not set a string value for the <code>exports</code> config option.</li>
</ul>
<p>Or, if the error shows up only in IE and not in other browsers (which may generate a <a href="#scripterror">Script error</a>, the script probably:</p>
<ul>
<li>Threw a JavaScript syntax/evaluation error.</li>
<li>Or there was a 404 error in IE where the script failed to load.</li>
</ul>
<p>Those IE behaviors result in <a href="api.html#ieloadfail">IE's quirks in detecting script errors</a>.</p>
<p>To fix it:</p>
<ul>
<li>If the module calls define(), make sure the define call was reached by debugging in a script debugger.</li>
<li>If part of a shim config, make sure the shim config's exports check is correct.</li>
<li>If in IE, check for an HTTP 404 error or a JavaScript sytnax error by using a script debugger.</li>
</ul>
</div>
<div class="section">
<h2><a name="scripterror">Script error</a><span class="sectionMark">&sect; 7</span></h2>
<p>This occurs when the script.onerror function is triggered in a browser. This usually means there is a JavaScript syntax error or other execution problem running the script. To fix it, examine the script that generated the error in a script debugger.</p>
<p>This error may not show up in IE, just other browsers, and instead, in IE you may see the <a href="#nodefine">No define call for ...</a> error when you see "Script error". This is due to <a href="api.html#ieloadfail">IE's quirks in detecting script errors</a>.</p>
</div>
<div class="section">
<h2><a name="interactive">No matching script interactive for ...</a><span class="sectionMark">&sect; 8</span></h2>
<p>This error only shows up in some IE browsers. Most likely caused by loading a script that calls define() but was loaded in a plain script tag or via some other call, like an eval() of a JavaScript string.</p>
<p>To avoid the error, be sure to load all scripts that call define via the RequireJS API.</p>
</div>
<div class="section">
<h2><a name="pathnotsupported">Path is not supported: ...</a><span class="sectionMark">&sect; 9</span></h2>
<p>This error occurs when the optimizer encounters a path to a module or script which is a network path. The optimizer only allows
building with local resources. To fix it:</p>
<p>Make sure you reference the network dependency as a module name, not as a full URL, so that it can be mapped to a different
during the build:</p>
<pre><code>//DO NOT DO THIS
require(['http://some.domain.dom/path/to/dependency.js'],
function (dependency) {});
//Rather, do this:
require.config({
paths: {
'dependency': 'http://some.domain.dom/path/to/dependency'
}
});
require(['dependency'], function (dependency) {});
</code></pre>
<p>If you want to include this dependency in the built/optimized file, download the JS file and in the
build profile for the optimizer, put in a paths config that points to that local file.</p>
<p>If you want to <b>exclude</b> that file from being included, and just need to map "dependency"
for the build (otherwise it will not build), then use the special "empty:" paths config:</p>
<pre><code>//Inside the build profile
{
paths: {
'dependency': 'empty:'
}
}
</code></pre>
</div>
<div class="section">
<h2><a name="sourcemapcomments">Cannot use preserveLicenseComments and generateSourceMaps together</a><span class="sectionMark">&sect; 10</span></h2>
<p>In the r.js optimizer, <strong>preserveLicenseComments</strong> works as a pre- and post-processing step on a JS file. Various kinds of license comments are found, pulled out of the JS source, then that modified source is passed to the minifier. When the minifier is done, the comments are added to the top of the file by the r.js optimizer.</p>
<p>However, for the minifier to accurately construct a source map, the minified source cannot be modified in any way, so <strong>preserveLicenseComments</strong> is incompatible with <strong>generateSourceMaps</strong>. generateSourceMaps was introduced in version 2.1.2 of the optimizer.</p>
<p>The default for the optimizer is for <strong>preserveLicenseComments</strong> to be true. So if using <strong>generateSourceMaps</strong>, then explicitly set <strong>preserveLicenseComments</strong> to false. If you want to preserve some license comments, you can manually modify the license comments in the JS source to use the JSDoc-style <code>@license</code> comment. See "<a href="https://developers.google.com/closure/compiler/docs/js-for-compiler#tag-license">Annotating JavaScript for the Closure Compiler</a>" for more information. That same format works for UglifyJS2.</p>
</div>
<div class="section">
<h2><a name="importscripts">importScripts failed for ...</a><span class="sectionMark">&sect; 11</span></h2>
<p>When RequireJS is used in a <a href="https://developer.mozilla.org/en-US/docs/DOM/Using_web_workers">Web Worker</a>, <a href="https://developer.mozilla.org/en-US/docs/DOM/Using_web_workers#Importing_scripts_and_libraries">importScripts</a> is used to load modules. If that call failed for some reason, this error is generated.</p>
</div>