# Mustache on external js file

**URL:** https://discourse.nodered.org/t/mustache-on-external-js-file/22327
**Category:** General
**Created:** [27 February 2020 13:07 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327 "2020-02-27T13:07:04Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![tukru](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@tukru](https://discourse.nodered.org/u/tukru)
#### Post date: [27 February 2020 13:07 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/1 "2020-02-27T13:07:04Z")

</div>

Hi all,  
So I am using Mustache for some stuff off the JS. In a script tag inside the HTML is working but if I use it with an external JS file it isn't. Is there any way to make it work with external JS file?

Thanks!

---

<div class="post-metadata">

### Author: ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)
#### Post date: [27 February 2020 14:07 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/2 "2020-02-27T14:07:11Z")

</div>

Hi @tukru - can you describe a bit more about what you are trying to do? Where does Node-RED fit in with it?

---

<div class="post-metadata">

### Author: ![tukru](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@tukru](https://discourse.nodered.org/u/tukru)
#### Post date: [27 February 2020 14:42 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/3 "2020-02-27T14:42:36Z")

</div>

Hi @knolleary  
What I mean is: I have some code that I need to be executed only if exists some parameters in the payload.  
Example:

```auto
<script>
{{#admin}}
Execute some code with some data from payload
{{/admin}}
</script>

```

In the in page script is working without problems but in the other hand, in an external JS file added with script tag it doesn't work.

---

<div class="post-metadata">

### Author: ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)
#### Post date: [27 February 2020 14:48 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/4 "2020-02-27T14:48:38Z")

</div>

So is that example in a Template node? If not, how are you using mustache?

How is the external JS file loaded?

---

<div class="post-metadata">

### Author: ![tukru](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@tukru](https://discourse.nodered.org/u/tukru)
#### Post date: [27 February 2020 14:53 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/5 "2020-02-27T14:53:06Z")

</div>

Yes, is a Template node.  
The external JS file is loaded with an script tag like:

`<script src="/js/custom.js"></script>`

And the custom file is inside the pi, loaded using httpStatic .

---

<div class="post-metadata">

### Author: ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)
#### Post date: [27 February 2020 15:04 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/6 "2020-02-27T15:04:46Z")

</div>

The mustache functionality is specific to the Template node. It uses the template you provide to generate the text it passes on - which may be HTML, CSS, JavaScript - anything really.

Loading an external file via a script tag is done entirely in the browser - Node-RED doesn't get involved at all. There is no support for using mustache in javascript files loaded by the browser.

If you wanted to do that, you'd need to create a new HTTP end point in your node-red flow that serves up that `custom.js` content - which can then come from a Template node and generate whatever you want.

---

<div class="post-metadata">

### Author: ![tukru](https://avatars.discourse-cdn.com/v4/letter/t/f0a364/32.png) [@tukru](https://discourse.nodered.org/u/tukru)
#### Post date: [28 February 2020 09:46 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/7 "2020-02-28T09:46:18Z")

</div>

Ok, all clear. So I will have to separate the payload I need for the HTML and the payload I need for the JS or do the same query 2 times. Maybe I will leave the code I need with payload inside the script like I have right now.

Thanks for all!

---

<div class="post-metadata">

### Author: ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)
#### Post date: [28 February 2020 10:33 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/8 "2020-02-28T10:33:55Z")

</div>

You could try putting your script in a file on the device running NR then use a `file-in` node to read the file, a `change` node to move it to msg.template and then send that to the ui-template node.

Here is an example using the first example in the ui\_template node. You need to copy that example to a file and point the `file-in` node at that file.

```auto
[{"id":"979f0724.971cd8","type":"debug","z":"ba53629d.ec0638","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":310,"y":240,"wires":[]},{"id":"a86875a2.4e1588","type":"ui_template","z":"ba53629d.ec0638","group":"9ebac909.a8afb8","name":"","order":1,"width":0,"height":0,"format":"<div layout=\"row\" layout-align=\"space-between\">\n <p>The number is</p>\n <font color=\"{{((msg.payload || 0) % 2 === 0) ? 'green' : 'red'}}\">\n {{(msg.payload || 0) % 2 === 0 ? 'even' : 'odd'}}\n </font>\n</div>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":320,"y":200,"wires":[["979f0724.971cd8"]]},{"id":"91ba7c8f.8f0e7","type":"file in","z":"ba53629d.ec0638","name":"","filename":"/Users/Paul/tmp/template_test.txt","format":"utf8","chunk":false,"sendError":false,"encoding":"none","x":400,"y":120,"wires":[["c1cf44b9.69ef8"]]},{"id":"c1cf44b9.69ef8","type":"change","z":"ba53629d.ec0638","name":"","rules":[{"t":"move","p":"payload","pt":"msg","to":"template","tot":"msg"},{"t":"move","p":"value","pt":"msg","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":160,"wires":[["a86875a2.4e1588"]]},{"id":"42277292.282c64","type":"change","z":"ba53629d.ec0638","name":"","rules":[{"t":"move","p":"payload","pt":"msg","to":"value","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":80,"wires":[["91ba7c8f.8f0e7"]]},{"id":"7d10621b.fdc9c4","type":"ui_button","z":"ba53629d.ec0638","name":"","group":"9ebac909.a8afb8","order":3,"width":0,"height":0,"passthru":false,"label":"button 6","tooltip":"","color":"","bgcolor":"","icon":"","payload":"6","payloadType":"num","topic":"","x":100,"y":100,"wires":[["7b73700.1301d1","42277292.282c64"]]},{"id":"3ace5a14.979716","type":"ui_button","z":"ba53629d.ec0638","name":"","group":"9ebac909.a8afb8","order":2,"width":0,"height":0,"passthru":false,"label":"button 5","tooltip":"","color":"","bgcolor":"","icon":"","payload":"5","payloadType":"num","topic":"","x":100,"y":60,"wires":[["7b73700.1301d1","42277292.282c64"]]},{"id":"9ebac909.a8afb8","type":"ui_group","z":"","name":"Group 1","tab":"77d04ed1.91ec5","order":1,"disp":true,"width":"6","collapse":false},{"id":"77d04ed1.91ec5","type":"ui_tab","z":"","name":"Mustache test","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)
#### Post date: [13 March 2020 10:33 UTC](https://discourse.nodered.org/t/mustache-on-external-js-file/22327/9 "2020-03-13T10:33:57Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.