I'm working on a project with Node-RED and @flowfuse/node-red-dashboard (Dashboard 2.0) where I rely heavily on custom UI templates.
I'm looking to build a reusable component system by publishing my custom Vue 3 components as a standalone npm package. Ideally, I’d like to import this package into my Node-RED setup so that the components are registered globally and can be used out of the box in any ui-template node (just like Vuetify or component libraries work), e.g., <my-custom-card :data="msg.payload" />.
Is it possible to do something like this? if not, has someone encountered this same problem and how did they fix it?
In your case it might be: http-in → template node containing your definitions → http-response or http-in → file-nodes to load your package data → http-response
Each ui-template runs as its own Vue application, so components aren't automatically shared or globally registered across templates like they would be in a standard Vue/Vite application. There isn't currently a supported mechanism to install an npm package into Dashboard 2.0 and have its components globally available in every ui-template.
A few alternatives are:
Load your component library via a CDN or bundled UMD/ESM build inside each ui-template, then register the components locally.
Create a shared JavaScript file containing your components or composables and include it wherever needed.
Build a custom Dashboard 2.0 widget/node if you need reusable components across many flows. This is the recommended approach for reusable UI functionality.
If you're already using a build tool (Vite/Rollup/Webpack), you can bundle your component library and import it into each template, but you'll still need to register the components within that template's Vue app.
So, while you can definitely reuse Vue components, Dashboard 2.0 doesn't currently support a plugin system equivalent to app.use(MyLibrary) that registers components globally across all ui-template nodes.
If your goal is to create something that behaves like Vuetify or another Vue component library, a custom Dashboard widget/package is probably the cleanest long-term solution.
