Importation into typescript project returns undefined instead of the expected WebMidi singleton

[the-simian]

This might be an easy one to fix, but I am using typescript and webpack. when I use

import WebMidi from 'webmidi'

I just get undefined !

What's weird is I do see the type descriptions in my editor

I can see this in the webmidi.d.ts file

/** The `webmidi` module is a singleton of the `WebMidi` class */
declare const webmidi: WebMidi

export default webmidi;

Yet, here is the actual output.

using all lowercase (as in the example) also produces identical results.

[the-simian]

I should add that importing the interfaces also does show me the descriptions in the ts file, but no matter what the actual lib itself produces 'undefined' instead of the expected WebMidi singleton.

[the-simian]

Update:
This works:
import * as webmidi from 'webmidi';
this breaks:
import webmidi from 'webmidi

[the-simian]

this appears to have been under discussion in #54 . I can confirm that the 'standard' export does NOT work (at least for me) but the other method, using * works great. I don't see this as a major issue, but I would recommend updating the README.md to inform typescript users.

Would you like a PR for this?

[the-simian]

What's weird is I am looking at the code in the Wedmidi.d.ts file and, like it should be working, so I am somewhat unclear why it is not.

but I have to use the * to get:

[djipco]

Would you like a PR for this?

Absolutely.

I added this issue to our todo list for version 3. Thanks for reporting it. TypeScript has never been officially tested and supported (even if it does work).

[TimSusa]

I like named exports and imports, because they help to be explicit .

[djipco]

Since there's no more activity here, I'm going to close this.

[the-simian]

@djipco did this get fixed?

[djipco]

@the-simian Well... I was sorta expecting a PR from you. :-)

The thing is that I do not use TypeScript. I welcomed the TypeScript definitions (which were contributed by @mmmveggies) but haven't done any testing.

Since WebMidi is a singleton, what gets exported is not the class itself but an instance of WebMidi. This might explain why import * as webmidi from 'webmidi'; works while import webmidi from 'webmidi'; breaks. See, there is nothing called "webmidi" being exported. In all honesty, I wouldn't know exactly what would make TypeScript happy.

With version 3, we will move to a modern ES6-module approach which, I'm guessing, will make this all easier.

In any case, I updated the README.md file with the little knowledge that I do have. Feel free to submit something clearer if you have time.

[the-simian]

@djipco I'm in a similar boat as you with Typescript. I normally don't use Typescript, but I am using it in this project to get a feel for it and see what kind of benefits it provides. Honestly, I'm a bit underwhelmed so far, but I need to give it more of a chance I guess. It has mostly been additional friction.

I actually don't mind the import * approach, personally - I just need it to work. I am sorry I didn't have time to submit a PR. I looked at the definition file and it was written in a way I would have expected it to work (but didn't). I understand your reasoning for closing the issue. Maybe just updating the documentation is enough.

I'll open a PR if I get around to figuring out why it is not working, but that might be some time. If I do I'll reference this and also update the ReadMe too so there's no miscommunication to others.

Again, I am sorry I didn't have the time; it wasn't out of disinterest, but simply couldn't do it with my current workload.

[djipco]

@the-simian No worries. I'm putting this off until version 3 because I'm also very busy. The important thing is that, for now, there is a solution (albeit not perfect). Cheers!

[michaelcaterisano]

I'm still having this issue, and neither import WebMidi from "webmidi" nor import * as WebMidi from "webmidi" is working for me.

[djipco]

I tentatively added a types directory with d.ts files for all current classes (this is what the TypeScript compiler outputted). Is the usual practice to have a single index.d.ts file? In any case, if you want to give it go, be my guest!

By the way, this is in the develop branch for v3.