Volumio3 UI Development

Just starting the get into some Volumio development, I’m building a device based loosely off the NAD C700 Series of streaming amps. The big issue is I’m having trouble getting my development environment setup on my mac. npm keeps coming back with lots of deprecations. I also noticed the docs mention Node v6.9.5 which it really old from what I can tell. I’m new to NodeJs but have a C#/Flutter/Dart/React background so not worried about picking it up, but getting the environment setup is tedious at best so far. ha. Anyway I don’t know if the docs are old or if there is one I’m missing. Any guidance would be appreciated. I’m still searching through here as well but seems like everything I find is years old.

Finally got it working later that night.

1 Like

@Kevin_Craig I am facing the same struggle. Could you elaborate on how you solved setting up the dev environment?

You might want to check the developers documentation:

Thanks, I am aware of the dev docs. Re-reading the OP and my own request, I should clarify that I was talking about the Volumio2-UI Project on Github. The readme there talks about nvm and a specific node version, but even when following this strictly, this leads to lots deprecations and some serious errors nevertheless. But obviously, the old UI is still being built and shipped with recent Volumio releases, so there must be a way to use it nowadays. Any pointers on how to set up a working dev/build environment would be appreciated. (i.e., you could provide a working package-lock file…?)

Follow-up: The dev docs on GitHub provide a bit more information than the official webpage and indeed helped in understanding the build process of the whole system. I see now that you pull the UI from pre-built branches from the UI repo.

However, It’s still unclear to me how you actually are able to build the classic UI on a modern system in order to generate those branches.

The closest I got was firing up an old Ubuntu 18.04 laptop and following the travis build script, but I had to downgrade node to v8.17.0 + fix some package versions in order to get rid of the “'class v8::Object' has no member named 'ForceSet'” error. Now I can actually build the project, but it still cannot be run on a recent Volumio release (produces grey page only). To get around this, I can insert the generated .js directly into the target system. The .css is even more complicated, as the generated one isn’t compatible, so I have to insert my changes manually into the existing css there. What a pain…

Therefore, If you could give some pointers on how you actually build those dist and dist3 branches, I would be very happy!