Import JavaScript library into node-red

Dashboard
2

Hi @abra

If you want to use third party libraries as part of your node-red dashboard then you need to:

  1. copy those libraries to a directory of your choosing
  2. set httpStatic in your node-red settings file to point at that directory.

The node-red runtime will then serve the files from the directory.

You can then add the appropriate <script> and <style> tags to a ui_template node in order to load that content into your dashboard.

For example,

  1. create a directory called /home/user/node-red-static/charts/
  2. copy all of the chart.js content into that directory - lets assume that includes a file called chart.js.
  3. set httpStatic in your settings file to /home/user/node-red-static
  4. restart Node-RED
  5. check you can load http://localhost:1880/charts/chart.js in your browser.

In your ui_template you'd need:

<script src="http://localhost:1880/charts/chart.js"></script>

Of course, you'll have to refer to the chart.js documentation to understand exactly what files need including in your html page.

8 Likes