ReferenceError: Vex is not defined

[ChrisChan888]

error - node_modules/smoosic/src/smo/data/noteModifiers.ts (18:0) @ eval
error - ReferenceError: Vex is not defined
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)
    at eval (./src/app/page.tsx:8:93)
    at Object.(sc_client)/./src/app/page.tsx (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/app/page.js:1604:1)
    at __webpack_require__ (/Users/yiulapsang/Desktop/workspace/musics/crypto-test/.next/server/webpack-runtime.js:33:42)

[AaronDavidNewman]

Hi Chris, Smoosic is not very sub-project-friendly right now. So you might have the best luck just compiling it in its own git repository, and then including smoosic.js in your program as a library. See the smoosic.html page in the /build/html directory, and the other html pages that demonstrate different ways to use the library. So see for instance 'asyncPen.html' to see how it can be used just as a music engraving engine.

In your case, since you're using a reactive component library, you can use it in library mode and supply your own UI if you want. This is why I purposefully have not committed to any UI component technology - the UI is all ad-hoc html. See 'custom-menus.html' and 'custom-keybinding.html' for an example of how to customize the UI with your own components. The UI contract is pretty stable.

Smoosic uses vexflow for an engraving engine. I include my own build but you should be able to use any released version >= 4.x. You can also include my version directly from the cdn:

        <script type="text/javascript" src="https://aarondavidnewman.github.io/vexflow_smoosic/releases/vexflow-debug.js"></script>

Maybe the next step with Smoosic is to break it up into different sub-repositories that can be included in other packages.