0xfe / vextab

A VexTab Parser for VexFlow
Other
588 stars 115 forks source link

Module import isn't working. Uncaught TypeError: Cannot read property 'Flow' of undefined #112

Closed pasho closed 3 years ago

pasho commented 3 years ago

I'm trying to use VexTab api from the npm package. Import doesn't seem to work. I've taken the example from the readme.

import {VexTab, Artist, Vex} from 'vextab';

console.log(VexTab, Artist, Vex);

const Renderer = Vex.Flow.Renderer;

const input = document.getElementById("vex").innerText.trim();
const renderer = new Renderer(document.getElementById("vex"), Renderer.Backends.SVG);

// Initialize VexTab artist and parser.
const artist = new Artist(10, 10, 600, { scale: 0.8 });
const tab = new VexTab(artist);

try {
    tab.parse(input);
    artist.render(renderer);
} catch (e) {
    console.error(e);
}

Getting the following error in console:

Uncaught TypeError: Cannot read property 'Flow' of undefined
    at Module.<anonymous> (main.js:9)
    at i (main.js:1)
    at main.js:1
    at main.js:1

Logging the imported outputs all as undefined.

Update

I've been playing around with VexTab webpack.config.js. Adding libraryTarget: 'umd' to the output fixes it.

Verisimilitude commented 3 years ago

Had the same problem and the pull request solved it. Thanks!