Cannot play midi with midi-player-js in Quasar framework (vue)

Question

I am trying to play and get the midi signals from a midi file in quasar. Im using midi-player-js library but I cannot get it to work.

here is my component:

<template>
  <div>
    PLAY
    <q-btn round @click="play" size="10px" />
  </div>
</template>

<script>
import { Player } from "midi-player-js";

export default {
  name: "Playlist",
  methods: {
    play: function () {
      console.log("PLAY");
      let player = new Player((event) => {
        console.log("TEST", event);
      });
      //   var Player = new MidiPlayer.Player(function (event) {
      //     console.log(event);
      //   });
      player.loadFile("./test.mid");
      player.play();
    },
  },
};
</script>

When using the latest version of the library (2.0.14) I get the errormessage:

Uncaught TypeError: midi_player_js__WEBPACK_IMPORTED_MODULE_0__.Player is not a constructor
    at Proxy.play (VM198 Playlist.vue:23)
    at callWithErrorHandling (runtime-core.esm-bundler.js?9e79:155)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?9e79:164)
    at emit (runtime-core.esm-bundler.js?9e79:993)
    at eval (runtime-core.esm-bundler.js?9e79:7310)
    at onClick (QBtn.js?9c40:152)
    at callWithErrorHandling (runtime-core.esm-bundler.js?9e79:155)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?9e79:164)
    at HTMLButtonElement.invoker (runtime-dom.esm-bundler.js?8886:349

And when I am using version 2.0.3 (the same that is used in this working example) I am getting the errormessage:

Uncaught Error: Cannot find module 'fs'
    at s (midiplayer.js?5109:1)
    at eval (midiplayer.js?5109:1)
    at Player.loadFile (midiplayer.js?5109:2027)
    at Proxy.play (Playlist.vue?3e9b:31)
    at callWithErrorHandling (runtime-core.esm-bundler.js?9e79:155)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?9e79:164)
    at emit (runtime-core.esm-bundler.js?9e79:993)
    at eval (runtime-core.esm-bundler.js?9e79:7310)
    at onClick (QBtn.js?9c40:152)
    at callWithErrorHandling (runtime-core.esm-bundler.js?9e79:155)

If I am using this code:

<template>
  <div>
    PLAY
    <q-btn round @click="play" size="10px" />
  </div>
</template>

<script>
import MidiPlayer from "midi-player-js";

export default {
  name: "Playlist",
  methods: {
    play: function () {
      console.log("PLAY");
      var player = new MidiPlayer.Player(function (event) {
        console.log(event);
      });
      player.loadFile("./test.mid");
      player.play();
    },
  },
};
</script>

Im getting the errormessage:

runtime-core.esm-bundler.js?9e79:218 Uncaught loadFile is only supported on Node.js

What am I missing? Maybe the way I load the midifile?