1
\$\begingroup\$

I'm writing a react/redux application and I'm on a stage when I need to connect it with backend made with .net using a signalR socket connection.

At the moment I've established interconnection between front and backend but I don't quite like how the realization looks like at the moment.

  1. I needed to clearly assign jQuery to the global scope in order ms-signalr-client to see it and use it. I know that I'm able to assign to the global scope using webpack, but in order to do that, I would need to 'eject' create-react-app https://github.com/facebookincubator/create-react-app which is a downside at the moment. I have also tried to use import 'expose-loader?jQuery!jquery'; but once again, webpack loaders doesn't allow to use import syntax this way.

  2. Also, I didn't quite like that in ES6 I need to mix 'imports' with 'require', but that's the only way I found to include 'ms-signalr-client' library after jQuery, so there is no error.

Would appreciate any hints or advice ))

import $ from 'jquery';

window.jQuery = window.$ = $;
require('ms-signalr-client');

const connection = $.hubConnection('http://' + HubURL);
const proxy = connection.createHubProxy('hubName');

function startSignalR(store, cb) {
  proxy.on('broadcastMessage', (message) => {
    console.log(message);
  });

  connection.start(() => {
    console.log('connection started !');
    cb();
  });
}
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.