beet.js
beet.js copied to clipboard
Error when creating a layer
I started experimenting with beet to create a non-euclidean rhythm generator. I'm using the npm version of it inside my vuejs project. And whenever I create a layer from a pattern (as the docs say) I get this error.
Uncaught (in promise) TypeError: can't convert undefined to object
webworkify beet_js.js:4256
Metro wa-metro.js:21
Layer layer.js:10
js beet_js.js:4549
My code:
import Beet from 'beet.js'
const context = new AudioContext();
const beet = new Beet({
context: context,
tempo: 120
});
let pattern = beet.pattern(3, 7);
let layer = beet.layer(pattern, (t) => console.log(t));
@davay42 At first glance, it seems like an issue with web workers in the underlying scheduling library 'wa-metro'. My guess is that by installing via npm and including in vue, the worker file does not get included. Are you using something like webpack to bundle your application?
Yeah, I'm using vitepress
based on vitejs
. https://vitejs.dev/
I'm not familiar with those tools you mentioned..
My suggestion would be to try and setup webpack such that it contains the file located here '/node_modules/wa-metro/lib/worker.js/' in the correct location where that library can load it in.
I'm currently a bit busy I can not try it out myself. But might be able to give it a go if you wait some time.
There potentially need to be some changes to this library to support webpack.
Webback is like a thing of the past as it's way slower, than new build tools built around esbuild
. Vite is a breakthrough in the js ecosystem. That is I couldn't make webpack work for many times and stayed fully client-side with my vue apps. But vite just does the job almost effortlessly and works right from the box. Nobody would ever get back to webpack after such an dev experience ))
I tried installing wa-metro
as a separate package, but it doesn't change anything - the error is still there... I'm OK to wait. I also can make a small reproduction repo with vite for you to test against.
The thing is that when wa-metro
was build originally, it was built with browserify
in mind. Now browserify is not that popular anymore, webpack is also going away. We don't want to make the library dependant on any bundling library. I need to change it such that it works with any bundling.
Yeah, sure! Plain JS is enough here! vite
and other more modern tools are based on native js import - export
and don't need any kind of special treatment.