CODEWITHSUNDEEP
javascriptrequirejs
sinθ
sinθ

Reputation: 11503

Specifying relative paths from `RequireJs`

I have the baseUrl in a RequireJs based application set to /angular. Sometimes I'd like to set the path relative to the base, other times I'd like to set it relative to the current directory.

I'm very new to RequireJs and very confused.

This is what I have now:

require([
    'require',
    'angular',
    'module/draft/draftDisplay'// module that I want relative to baseUrl
], function(requireLocal, angular) {

requireLocal('./autoSave'); // Modules that I want relative to current url
requireLocal('./module');

Which creates this error: Error: Module name "autoSave" has not been loaded yet for context: _

As I said before, I can't get a good handle on how RequireJs works. Some things I don't understand are:

1) When does RequireJs use the baseUrl and when does it use the current directory

2) What's the difference between a module ID and its path?

3) Does the way previous modules are specified in the require([...],.. array affect how subsequent ones are resolved (which seemed to be the case when I tinkered)

If you could include those things in your answer, that would be very helpful.

Upvotes: 0

Views: 61

Answers (1)

Nikos Paraskevopoulos
Nikos Paraskevopoulos

Reputation: 40318

1) When does RequireJs use the baseUrl and when does it use the current directory

Always baseUrl, except when the module name is prefixed by ./ or ../, in which case it uses the directory of the module that requires the other.

2) What's the difference between a module ID and its path?

The path includes the baseUrl. E.g. could be something like scripts/vendor/angular/angular.js. The module id does not include the baseUrl or the suffix, e.g. for baseUrl: 'scripts', the module id above would be vendor/angular/angular.

3) Does the way previous modules are specified in the require([...],.. array affect how subsequent ones are resolved (which seemed to be the case when I tinkered)

No.

Your error is caused from using the synchronous version of require for modules that are not loaded. Use the asynchronous version instead; something like:

requireLocal(['./autoSave', './module'], function(autosave, module) {
    // here autosave and module are loaded
});
// BEWARE: Here neither autosave nor module are loaded

But are you sure you want the inner require? From the information you provide, pulling the requirements in the outer require would probably suffice, i.e.

require(['require','angular','module/draft/draftDisplay','./autoSave','./module'],...)

Also, the import called 'module' has special meaning in require; it contains information about the current module; If you are literally using './module' it will be quite different than 'module' (the first looks for a module.js file in the same directory as this file, the second provides information about this module).

Upvotes: 1

Related Questions