'no such file' error when using grunt-requirejs compile

Question

Since most issues with require.js build has to do with file structure and relative path reference, I created a repo here: https://github.com/ttback/requirejs-example for easier troubleshoot.

The error is when i run grunt, I will get no such file or directory requirejs-example/src/js/bundle/js/bundle/utils.js

This is due to the wrong baseUrl. I want it to be src/ but I can't set it since it goes to find the dependencies for src/js/bundle/main.js based on my Gruntfile. So the base is at src/js/bundle. The current main.js works with the index.html, if I change the relative path to utils.js from .js/bundle/utils.js to ./utils.js inside main.js, the app wil break.

Is there any way I can make the grunt-requirejs work with what I have?

Answer 1

First of all, points for adding a decent code example.

The problem is easy to solve actually.

Simply change:

var utilsObject = require('./js/bundle/utils.js');

to:

var utilsObject = require('./utils');

Now the build tool and the app will work.

By adding a .js suffix you were bypassing the baseUrl rules that RequireJS applies to module paths. From the docs:

RequireJS also assumes by default that all dependencies are scripts, so it does not expect to see a trailing ".js" suffix on module IDs.

There may be times when you do want to reference a script directly and not conform to the "baseUrl + paths" rules for finding it. If a module ID has one of the following characteristics, the ID will not be passed through the "baseUrl + paths" configuration, and just be treated like a regular URL that is relative to the document:

• Ends in ".js".
• Starts with a "/".
• Contains an URL protocol, like "http:" or "https:".

http://requirejs.org/docs/api.html#jsfiles