NPM Package not working

Ask the community
,
1

After getting the webmidi NPM package approved and installed, I am unable by importing in backend code, nor as a public js file, nor importing it directly to the frontend code. I receive the following error in each case:

Importing via backend:
import {enableMidi} from ‘backend/WebMidi’;

Error loading web module backend/WebMidi.jsw: Cannot find module ‘webmidi’
Require stack:

  • /user-code/backend/WebMidi.jsw
  • /user-code/stubmodule-that-does-the-require.js
  • /elementory/node_modules/scoped-require/index.js
  • /elementory/factories.js
  • /elementory/create-app.js
  • /elementory/cloud-grid-runner.js

Importing via public js file:
import {enableMidi} from ‘public/new-file.js’

Cannot find module ‘webmidi’ in ‘public’

Importing via frontend code:
import WebMidi from ‘webmidi’ ;

Cannot find module ‘webmidi’ in ‘public/pages/o2mgp.js’

From this similar post I read it seems the development team needs to fix something to allow the usage of this package.

Thanks for your help.

2

So for some reason the package is useable now, but WebMidi is not enabled when running a page code through Wix. I think its because a lot of the navigator DOM web apis are not accessible on Wix. Is there a work around to this? To clarify with examples the WebMidi NPM package can be installed and the functions called in it, but never enabled.

WebMidi.enable(function (err)){…} would return with “WebMidi could not be enabled. Error: The Web MIDI API is not supported by your browsers”

Where as:

if (navigator.requestMIDIAccess) {
    console.log('This browser supports WebMIDI!');} else {
    console.log('WebMIDI is not supported in this browser.');}

return the second message error because on wix velo coding navigator object does not have requestMIDIAccess.

Any thoughts or work arounds?

3

Some modules can to be loaded using require on browser side:
var WebMidi = require(’ webmidi’) ;

and import/require on server side.

4

Thanks @mvveiga . Could you elaborate more or is there any documentation link I can read up to do this correctly?

5

Google import vs require javascript.
[Require vs Import | Know The 4 Most Amazing Comparisons](
Require vs Import | Know The 4 Most Amazing Comparisons

Import)

[Import](

Import) /Require depends on the browser or package so try both.

6

Thanks @MVVeiga, but I meant how would I do it on Wix velo. Right now calling a require in the front end page code still gives me the same error. I’m going to try backend calls, but is there a proper standard that I should follow when doing this on Velo?