Loading jCarousel with RequireJS + jQuery

问题

I'm trying to load a java plugin called jCarousel with RequireJS. My project structure looks like this:

[project root]
  assets
    app
    js
      app.js
      vendor
        jquery-2.1.0.js
        jquery.jcarousel-core.js
        require.js

I'm using the shim config so I first load RequireJS like so:

    <script data-main="assets/js/app" src="assets/js/vendor/require.js"></script>

Then in app.js, I have this configuration of RequireJS:

requirejs.config({
    "baseUrl": "assets/js/vendor",
    "paths": {
      "app": "../../app"
    },
    "shim": {
        "jquery.jcarousel-core.js": ["jquery-2.1.0"]
    }
});

// Load the main app module to start the app
requirejs(["app/main"]);

When I load the page up with this framework, all the scripts seem to load, but I get an error in the jcarousel code in the browser console:

Uncaught ReferenceError: jQuery is not defined

That error seems to come from the line in the jQuery wherein -- and I can't remember the technical name for this procedure -- the '$' symbols is mapped to 'jQuery', e.g.:

        return Plugin;
    };
}(jQuery));  // THIS IS THE OFFENDING LINE

Any guidance here would be much appreciated!

SOLUTION Based on Answer

So the problem here was as @MakeeshSapkal put it, the line in my shim configuration for the jcarousel module should not have included .js. So the configuration should have been:

requirejs.config({
    "baseUrl": "assets/js/vendor",
    "paths": {
      "app": "../../app"
    },
    "shim": {
        "jquery.jcarousel-core": ["jquery-2.1.0"]
    }
});

回答1:

Get rid of .js from the shim configuration. :)

"shim": {
    "jquery.jcarousel-core": ["jquery-2.1.0"]
}

Hope this works!!!

来源：https://stackoverflow.com/questions/21810326/loading-jcarousel-with-requirejs-jquery

标签

jquery

requirejs

jcarousel