I am trying to load jquery in noConflict mode by using require
require.config({
paths: {
'jquery': 'libs/jquery-req',
underscore: 'libs/underscore',
backbone: 'libs/backbone'
},
shim: {
jquery: {
init: function() {
console.log('jq init');
var jq = this.jQuery.noConflict(true);
jq.support.cors = true;
return jq;
},
exports: '$'
},
backbone: {
deps: ['underscore', 'jquery'],
init: function() {
console.log('b init');
},
exports: 'Backbone'
},
underscore: {
exports: '_'
}
}
});
and use it like that:
define([
'jquery',
'underscore',
'backbone'
], function(jq, _, Backbone) {
console.log(jq);
var initialize = function() {
// Router.initialize();
};
return {
initialize: initialize
};
});
unfortunately it seems shim.jquery.init function is never called. Can someone try to help me understand why? What is strange when I rename jquery -> jquery-reg then it seems to work, but it requires to change dependency defined in every files.
noConflict( [removeAll ] ) A Boolean indicating whether to remove all jQuery variables from the global scope (including jQuery itself).
Simply use the require function. The first parameter should be an array of dependencies, and the second parameter should be an anonymous function to run after the dependencies have loaded. The parameters for the anonymous function are mapped to the first parameter of the require function.
To include the Require. js file, you need to add the script tag in the html file. Within the script tag, add the data-main attribute to load the module. This can be taken as the main entry point to your application.
Yes, you can use multiple versions of jQuery on the same page. To avoid any kind of conflict, use the jQuery. noConflict() method. jQuery.
Create the following noconflict.js module:
define(["jquery"], function($) {
//drop the `true` if you want jQuery (but not $) to remain global
return $.noConflict(true);
});
Then, in your require.config add:
map: {
"*": {
"jquery": "noconflict"
},
"noconflict": {
"jquery": "jquery"
}
}
The noconflict version of jQuery will be handed to all modules (except noconflict). Get rid of the jQuery shim.
Please note that going the path of keeping jQuery out of the global namespace will prevent you from using any jQuery plugins that are non-AMD without modifying those plugins to be AMD modules. Shim doesn't do anything magical to take advantage of this setup. The same goes for any non-AMD module you might want to shim that depends on something you've made "pure" AMD.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With