requirejs unable to find module returning undefined

Question

i've been working with require before, but never ran into this issue, maybe i got a path wrong somewhere but this is my filestructure:

js
├───main.js
│
├───app
│   ├───app.js
│   ├───hello.js
│   ├───world.js
│   │
│   └───models
│       └───game.js
│
└───vendor
    ├───jquery.js
    └───require.js

main.js

require.config({
    paths: {
        'jquery':   '../js/vendor/jquery'
    },
    shim: {
        'jquery': {
            exports: '$'
        }
    }
});

require(['app/app', 'jquery', 'app/models/game'], function (App, $, Game) {
    console.log(arguments);
    $(function () {
        console.log('why is my App undefined?', App);
        App.init();

    });
});

app/app.js

define('App', ['hello', 'world'], function (hello, world) {

    var App = {};

    App.init = function () {
        alert(hello + ' ' + world);
    };

    return App;
});

the code fires alright, however my dependencies seem to fail on app or hello or world module, App logs as undefined, so does my game module.

app/app should be the right path to my App module or am I thinking that wrong?

Update

I thought the capital A for App fixed the issue (but at the same time I took a swing at Jlange's comment, so I fired up the app/App module from the index.html. Which seemed ok, but after continuing the development it came up again.

I can load every module in the same directory just fine, but I cannot modules from subdirectories.

like the initial example couldn't load app/App from within the Main module, so can the app/App module not import the models/Game module.

I literally have no clue what this can be, as I said before, I have worked with requirejs and have not run into this issue.

Update 2 I can make it work if I drop all the named modules,

define([dependencies], function (dependencies) {});

that works fine but as soon as I change it into a named module I cannot find it

define("moduleA", ['subdir/moduleB'], function (moduleB) {
    console.log(moduleB); // >> undefined
});
define("subdir/moduleB", [dependencies], function (dependencies) { return 'B'; });

Why do you include jquery in your require statement? I usually define it in the application file like define(['jquery',], function($) — RestingRobot
– RestingRobot, Commented Mar 18, 2013 at 21:00
well I have it in my main because the main has general require config, and boots the App, that's why it has jquery included there to boot the app on document ready state. — Sander
– Sander, Commented Mar 18, 2013 at 23:52
Glad you got it working, I was really interested in seeing the solution, as I use require.js a lot. — RestingRobot
– RestingRobot, Commented Mar 19, 2013 at 16:56
well, it really strikes me as odd that they discourage you to name modules, I thought it would be a natural way to create your own namespacing without having it related to your prefered folder structure. but I got it wrong :) took me only a few hours to figure out, so I'm quite relieved. — Sander
– Sander, Commented Mar 19, 2013 at 21:21

Sander · Accepted Answer · 2013-03-19 00:51:37Z

2

edited

after many tries, to fix the above code, and reading up in the requirejs help pages, I found a small passage, saying it is best not to use named modules and let the optimizer name them for you.

So I decided to remove all module names

moduleA.js

define(['subdir/moduleB'], function (moduleB) {
    console.log(moduleB); // >> 'B'
});

subdir/moduleB.js

define([dependencies], function (dependencies) { return 'B'; });

this works just fine... don't know how I got fixed on using those moduleNames, Thought it would be better to name your modules.

edited Mar 19, 2013 at 0:51

answered Mar 18, 2013 at 23:51

Sander

13.4k15 gold badges75 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jim Jeffries Over a year ago

it can be useful in development until your files and directory structure stabilises.

Sander Over a year ago

true but don't you then have to go over your entire list of modules to remove them? seems kind of overkill in medium to big applications. I'm looking into mantriJs too, just cus i'm curious... not really planning any development in it yet. though it uses namespaces instead of file paths.

Jim Jeffries Over a year ago

hopefully by the time you code base starts to get to that sort of size your directory structure will have stabilised enough not to warrant it.

Collectives™ on Stack Overflow

requirejs unable to find module returning undefined

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related