Using SystemJS, how do I specify that one library depends on another? For example, the Bootstrap JavaScript library depends on jQuery. Based on the SytemJS docs, I assumed I would specify this dependency using System.config.meta
property:
System.config({
baseUrl: './scripts',
defaultJSExtensions: true,
map: {
jquery: './lib/jquery-2.2.0.min.js',
bootstrap: './lib/bootstrap.min.js'
},
meta: {
bootstrap: {
deps: ['jquery']
}
}
});
System.import('./scripts/app.js');
But this seems to have no effect. When I run my application, the Bootstrap library throws a Bootstrap's JavaScript requires jQuery
error - which means Bootstrap is being loaded before jQuery.
How can I ensure that jQuery is always loaded before Bootstrap?
After blindly changing things, I happened upon a configuration that seems to work. Here's my config:
System.config({
defaultJSExtensions: true,
paths: {
jquery: './scripts/lib/jquery-2.2.0.min.js',
bootstrap: './scripts/lib/bootstrap.min.js'
},
meta: {
bootstrap: {
deps: ['jquery']
}
}
});
System.import('./scripts/app.js');
I think the key was changing from map
to paths
.
EDIT
Side note: after learning a bit more about SystemJS, I'm discovering that it is much easier to let jspm do the hard work of managing my SystemJS configuration.