Is it possible to set dependencies for an entire folder using require.js
?
I know that you can use the shim configuration to set dependencies for a file:
require.config({
shim: {
'plugin/backbone/xyz': {
deps: ['lib/backbone'],
exports: 'Backbone'
}
}
});
In the above example I define the dependencies for the plugin backbone/xyz, but I would like to define the dependencies for all backbone plugins:
require.config({
shim: {
'plugin/backbone/': { // I would like to specify a folder here but it doesn't work.
deps: ['lib/backbone'],
exports: 'Backbone'
}
}
});
I think that I once found a gist about it on GitHub, but I can't seem to find it again.
To clarify: This isn't about requiring an entire folder, but setting dependencies for it - What all files in the folder needs before they are ready to initialize, each and one of them. It would be accomplished by adding shims for all the files, but I would like to only have to add that shim once for the entire folder:
shim: {
'lib/backbone': {
exports: 'Backbone' // <- No use of .noConflict() so all plugins can be required and export Backbone as well.
},
'plugin/backbone/a': {
deps: ['lib/backbone'], // <- Require backbone
exports: 'Backbone' // <- Export backbone
},
// Same requirement and folder for these files:
'plugin/backbone/b': {
deps: ['lib/backbone'],
exports: 'Backbone'
},
'plugin/backbone/c': {
deps: ['lib/backbone'],
exports: 'Backbone'
}
}
RequireJS is, in web-terms, an old technology now (some might say ancient), but it is still in wide use and there have been a number of questions about RequireJS and DataTables recently.
RequireJS is a JavaScript library and file loader which manages the dependencies between JavaScript files and in modular programming. It also helps to improve the speed and quality of the code.
RequireJS can be initialized by passing the main configuration in the HTML template through the data-main attribute. It is used by RequireJS to know which module to load in your application. To include the Require. js file, you need to add the script tag in the html file.
Is RequireJS synchronous? So, RequireJS doesn't support it. From your use case it seems that you don't need synchronous RequireJS, you need to return result asynchronously. AMD pattern allows to define dependencies and load them asynchronously, but module's factory function must return result synchronously.
No, you cannot easily create a wildcard to add dependencies to all files under a folder from the configuration itself. You can however create a loop before the config and add whichever dependencies you want.
var config = {
shim: {
'plugin/backbone/xyz': {
deps: ['lib/dependency'],
exports: 'Backbone'
}
}
};
for(var shim in config.shim) {
if(shim.indexOf('plugin/backbone/') == 0) {
if(config.shim[shim].deps == null) {
config.shim[shim].deps = [];
}
config.shim[shim].deps.push('lib/backbone');
}
}
require.config(config);
This is the only way I can think of without having to override one of require's functions yourself. Not elegant, I will admit, but it will do the job.
Inspired by @J_A_X's answer
You can make an array of files that should share the same dependencies and create the shim dynamically:
var config = { shim: { /*...*/ } }
var plugins = ['a', 'b', 'c', 'd'],
plugin_shim = {
deps: ['lib/backbone'],
exports: 'Backbone'
};
plugins.forEach(function(file) {
config.shim['plugin/backbone/' + file] = plugin_shim;
});
require.config(config);
But this wouldn't work very well if someone would minuglify using r.js
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