Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Require.js build (r.js) with CDN jQuery isn't linking to the good jQuery path

I'm having a Backbone application using Require.js for AMD. I'm loading jQuery from Google CDN, but after build, the path to jQuery seems to be broken.

The build is happening without any trouble or error. But once I use the build version, jQuery is added to page using this URL:

http://example.com/assets/js/jquery.js

Instead of the CDN url. I feel this is due to the fact that my path config is lost and that require a dependency on "jquery" isn't taken as a reference to the path but as a normal call to a script.

Here's my main file:

main.js

require.config({
    baseUrl: '/assets/js/',
    paths: {
            use: 'libs/use-0.2.0.min',
            jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min',
            underscore: 'libs/underscore-1.3.1.min',
            backbone: 'libs/backbone-0.9.2.min'
},
    use: {
            'underscore': {
                    attach: '_'
            },
            'backbone': {
                    deps: ['use!underscore', 'jquery'],
                    attach: function(_, $) {
                            return Backbone;
                    }
            }
    }
});

require(['views/app'], function(AppView){
    var app_view = new AppView();
});

app.build.js

({
appDir: "../../www",
baseUrl: "assets/js",
dir: "../../build",
optimizeCss: "none",
optimize: "uglify",
findNestedDependencies: true,
preserveLicenseComments: false,
paths: {
    use: 'libs/use-0.2.0.min',
    jquery: 'empty:',
    underscore: 'libs/underscore-1.3.1.min',
    backbone: 'libs/backbone-0.9.2.min'
},
modules: [
    {
        name: "main",
        include: ["views/app"],
        exclude: ["jquery"]
    }
],
use: {
    'underscore': {
        attach: '_'
    },
    'backbone': {
        deps: ['use!underscore', 'jquery'],
        attach: function(_, $) {
            return Backbone;
        }
    }
}
})

(and I'm using use.js for loading non-AMD plugins)

like image 575
Simon Boudrias Avatar asked Mar 23 '12 18:03

Simon Boudrias


1 Answers

I would first upgrade to the lastest RequireJS and check out this link:

http://requirejs.org/docs/optimization.html#empty

And the notes on CDN in this section:

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

An example of a local fallback for require.config( { paths : {} } ):

The above pattern for detecting a load failure, undef()ing a module, modifying paths and reloading is a common enough request that there is also a shorthand for it. The paths config allows array values:

requirejs.config( {
    // To get timely, correct error triggers in IE, 
    // force a define/shim exports check.
    enforceDefine : true,
    paths : {
        jquery : [
            '//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min',
            //If the CDN location fails, load from this location
            'lib/jquery'
        ]
        // etc.
    }
} );
like image 130
Tyson Nero Avatar answered Oct 04 '22 20:10

Tyson Nero