SystemJS and SignalR - signalr

Question

Has anyone gotten SystemJS and SignalR to work together?
I have been trying to use SystemJS (from jspm) to load SignalR, but no matter what I do, there is always a race condition with the async loader. About half the times that it loads, SignalR is not loaded by the time my initialization code runs.
System.config({
baseURL: '/Scripts',
map: {
'jquery': '/bundles/jquery',
'jquery.ui.widget': 'jquery-ui-1.10.4.js',
},
meta: {
'/signalr/hubs': {
deps: ['jquery.signalR-2.2.0.min.js']
}
}
});
Promise.all([
System.import('jQuery.FileUpload/jquery.fileupload.js'),
System.import('knockout-3.1.0.debug.js'),
System.import('/signalr/hubs')
])
.then(function (libs, gg) {
var ko = libs[1];
//My init code
var chat = $.connection.jobProgress;
// Throws '$.connection is undefined' about half the time
})

Answer 1

Try this using signalr package config.
System.config({
baseURL: 'Scripts',
map: {
"signalr-jquery": "Scripts/jquery.signalR-2.2.0",
"signalr": "signalr",
"jquery": "/bundles/jquery" //I would pull it from jspm also
},
meta: {
"jquery": {
"format": "cjs"
},
"signalr-jquery": {
"format": "global",
"deps": ["jquery"]
}
},
packages: {
"signalr": {
"format": "global",
"defaultExtension": false,
"meta": {
"hubs": {
"format": "global",
"deps": ["signalr-jquery"]
}
}
}
}
})
and import hubs
System.import('signalr/hubs').then(function(hubs) {
})

Answer 2

I was able to load it with this configuration:
System.config({
map: {
'jquery': 'node_modules/jquery/dist/jquery.js',
'signalrJquery': 'jquery.signalR-2.2.0.js',
'signalrHubs': 'jquery.signalR-2.2.0.Hubs.js'
},
meta: {
"jquery-1.10.2.js": { exports: "$" },
signalrJquery: {exports: "$"},
signalrHubs: {
deps: ['jquery-1.10.2.js', 'signalrJquery'],
exports: "$"
}
});
Then fetch it like this:
import * as $ from 'signalrHubs';
or
var $ = require('signalrHubs');
Notice that the jquery version in the dependencies is the version that signalr depends on. The rest of the website can use a newer version if desired.