jazz-midi critical dependancy

[glend1]

everytime I load a page I get the following warning in the browser(chrome) ./node_modules/jazz-midi/index.js Critical dependency: the request of a dependency is an expression.

I am running on a Next.js development server. I don't know why this is happening. Doesn't seem to occur while running a production server.

[djipco]

Yes, I am aware of the warning but, so far, I haven't bee able to work around it. I'm guessing Next.js is using webpack, am I right?

[glend1]

yes

[djipco]

I made a little progress on that front. Here are the details (this is as much a reference for me as it is a follow-up to the issue):

• During compilation, Webpack (which is used by Next.js, React, etc.) tries to statically import all found dependencies.
• When Webpack scans the WebMidi.js code, it finds a reference to the jzz module. This module is only needed when the library runs in Node.js but Webpack doesn't know that so it tries to compile it in the final bundle.
• The jzz module itself requires the jazz-midi module.
• This error is triggered because the jazz-midi module uses an expression to import the correct library according to the platform its running on (Mac, Win32 or Linux). This is fine in Node.js but Webpack does not like it because it prevents it from knowing what to import at compile time.

A solution would be to tell Webpack to not include the jzz module at all (it is NOT needed in the browser). According to the Webpack documentation, this should be possible by using the externals configuration option.

If you simply ignore the warning, what happens is that the jzz module will unnecessarily be included in the bundle even though it will never be used. This is not a problem per-se but will result in an unnecessarily larger bundle size.

[glend1]

If i don't use jzz then there isn't any way (that i've been able to find) to write tests for my application.

I'm not sure if I install jzz seperately if webmidi would pick up on it.

[djipco]

For testing purposes, I simply use the CommonJS version (webmidi.cjs.js). I also use the midi package to create virtual MIDI ports (if you need that). Check out the test folder for examples.

[djipco]

This is fixed in v3.0.8.