Lit Sheet Music

In this article I will go over how to set up a Lit web component and use it to render musicxml from a src attribute or inline xml using opensheetmusicdisplay.

Now any sheet music can be rendered based on the browser width as an svg or canvas (and will resize when the viewport changes).

TLDR The final source here and an online demo.

Prerequisites 

• Vscode
• Node >= 16
• Typescript

Getting Started