Sparked Sparked - 9 months ago 216
TypeScript Question

SignalR in Angular2 (Typescript) - Import Error

I am having problems using signalR in an Angular2-Typescript app. I have it working fine in a previous Angular 1 app. My problem is with the importing, to which I'm new and suspect I'm making a stupid mistake.

I have the intellisense working but the strong typing doesn't seem to map to the original js file correctly.

In node_modules, I have these two folders (edited here for space):

│ │ jquery.d.ts
│ │ LICENSE.txt
│ │ package.json
│ │
│ │
│ ├───dist
│ │ core.js
│ │ jquery.js


The jquery.d.ts file is this one:

The signalr.d.ts file is this one:

Note: I have edited the signalr.d.ts to add this at the end, otherwise I can't import it:

declare var sr : JQueryStatic;

declare module 'signalr'{
export = sr;

In systemjs.config.js I use this to import signalr:

map: {
'signalr': 'npm:signalr/jquery.signalR.js'

And then in my component I use:

import * as $ from 'signalr'

I then have access to intellisense, for instance:

enter image description here

However, there are problems. If I use:


I get undefined.

Any help on this would be much appreciated.

Answer Source

You can try this way

map: {
      'ms-signalr-client': 'npm:ms-signalr-client/jquery.signalR.min.js',
      'jquery': 'npm:jquery/jquery.min.js'

in your ts

    import 'ms-signalr-client';
    import * as $ from 'jquery'; 

Hope this helps