Hi guys, Using node-red 4.08 I am reading a file that contains a vue template file (template, script & style sections) using a function node. I then connect that to ui template node. Any examples on how to do this. When I do it I just get the raw text from the file - it's not rendered html So t…

I think that you usually need triple rather than double braces for Dashboard to treat the content as dynamic?

Thanks for the reply. I tried this but it didn't work. Console log came back with an error when I tried. Any other suggestions? I presume it is possible? {{{msg.template}}}

Sorry, not sure with D2 as I don't really use it. I've loaded .vue files in the browser before, there are libraries that let you do that.

Thanks anyway - maybe someone else might be able to shed some light on it

Instead of mustache formatting, you can read the message using a socket listener, and then render it as needed

Sorry - don't understand how to implement that. So if I read the contents of the file do I connect it to a socket out node?? Could you expand your answer? Thanks

[image] JT3DAI: Sorry - don't understand how to implement that. So if I read the contents of the file do I connect it to a socket out node?? Could you expand your answer? In the JavaScript area of the ui-template, set a message listener as follows: <script> export default { // data() {},…

We don't support dynamic loading of a full vue component at the client-side at the moment, just the individual elements. This is mostly a security concern, we don't want to just take received code and run it all unvetted.

Ahh - understandable - thanks Joe. What I am trying to do is off load the code for a ui-template so I can use a proper code editor like visual studio code and source control. It's very tedious editing in the ui-template itself if the code is any way complex. What's the best practice for this?

Unfortunately, right now, it's old-school copy + paste. I know that @Steve-Mcl was investigating Vue support inside the Node-RED Editor, but I'm not sure on the status of that one, Steve - can you share an update please? For version control, I recommend FlowFuse , which has full Node-RED version con…

Node-RED

Node-RED Forum

Use function node to read vue file contents into dashboard 2.0 ui template

Dashboard

JT3DAI 28 April 2025 10:36 18

Thanks for the reply - will defo have a play around and see what makes most sense

Topic		Replies	Views
Dynamic HTML content in ui-template Dashboard dashboard-2	7	254	10 March 2024
UI Template Feedback & Thoughts Dashboard dashboard-2	14	460	11 January 2024
Dashboard-2 ui-template Dashboard dashboard-2 , ui-template	13	371	3 October 2025
Create custom ui node in Dashboard 2 General node-red-dashboard , ui-widgets , dashboard-2	36	1355	14 September 2024
Passing msg to template node showing a svg Dashboard flowfuse , dashboard-2	13	319	3 June 2024

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

Use function node to read vue file contents into dashboard 2.0 ui template

Related topics