runt18 / xrayquire

An auxillary script that gives extra info on the use of requirejs in a web page.

xrayrequire

An introspection tool for RequireJS. It dives into the the internals of RequireJS to show you information on the modules you load and flags some potential problems.

This is still under development. See the issues area for the features that it may support in the future.

See the tests directory for examples of the items xrayrequire checks.

Usage

Place it as a script tag right after require.js:

<script src="require.js"></script>
<script src="xrayquire.js"></script>

If you only want to load it during certain types of debug scenarios, you could rely on passing a ?xray to the page, and then dynamically insert the script tag for xrayquire.js like so:

<script src="require.js"></script>
<script>
if (location.search.indexOf('xray') !== -1) {
  document.write('<' + 'script src="xrayquire.js"></' + 'script>');
}
</script>

You can use this link to download the latest master version:

https://raw.github.com/requirejs/xrayquire/master/xrayquire.js

or use volo to fetch it for you:

volo add xrayquire

Error checks

Case insensitive ID collisions

Checks for module IDs that differ only by case, which indicates a probable typing error, or something that will lead to problems on case insensitive operating systems.

Information views

There are some information views about the modules that were loaded. These views are shown by popping a new window to a data: URL that has the display.

These displays are still very new, need lots of work.

Also note that your browser may block the new windows from being shown, so be sure to allow the popup if the browser gives the popup supression warning.

Dependency tree

To see the dependency tree for all the modules loaded, enter the following in the browser developer tool's console:

xrayquire.showTree();

Or to open it in an iframe directly...

xrayquire.showTree(null, true);

Show cycles

To show cycles (circular dependencies) in the modules loaded, enter the following in the browser developer tool's console:

xrayquire.showCycles();

License

MIT

Code of Conduct

jQuery Foundation Code of Conduct.