Import JavaScript library into node-red


#1

Can somebody please explain how can a third party plugin library like for instance Chart.js be locally installed into node-red? If I download Chart.js from github I get actually a Chart.js-master root directory with a lot of subdirectories and files. Do I have to copy everything into the node-red installation directory ?
I would like to use some charts from Chart.js into a UI template.


#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.


#3

I think you only need the file referenced in the readme dist/Chart.min.js (or the similar one with moment included), which you can find in the Releases section on github https://github.com/chartjs/Chart.js/releases