Adding JS Libraries

App Building
#1

Hi, relatively new user here. Trying to get to grips with using external libraries within Retool. I have read some other threads on here as well as the help guide within the docs and they don't completely seem to help.

I am wanting to add a jsonSchema validation library to my application. Initially I was using [https://cdnjs.cloudflare.com/ajax/libs/ajv/8.11.0/ajv7.min.js] (https://cdnjs.cloudflare.com/ajax/libs/ajv/8.11.0/ajv7.min.js) but this didn't seen to work (maybe I did something wrong?). I am not quite sure how I use the libraries - I've seen others use them like standard JS modules and import them (const ajv = require("ajv")) but this didn't work saying 'require not defined'.

I then tried adding jsonschema/index.js at master · tdegrunt/jsonschema · GitHub as this library doesn't have a cdnjs link - however this didn't work either. Can someone help me out with this please?

Many thanks in advance!

#2

@MatthewHole Are you using an OnPrem version of Retool?

Are you trying to use these libraries for all apps on your instance of Retool?

You can import the library here - under Settings if so:

Screen Shot 2022-09-27 at 8.43.10 AM
Screen Shot 2022-09-27 at 8.43.10 AM1640×1298 177 KB

And you can also import at the app level only if you want to:
When in the app select the menu on top right and then go to Scripts and styles:
Screen Shot 2022-09-27 at 8.44.35 AM

#3

In regards to OnPrem, its hosted within out AWS VPC so I want to say yes, but I haven't set up the instance myself.

Currently trying to import the library in one app through the Scripts and Styles tab. I don't think I have access to the Advanced options but I will speak to the instance owner about that.

In terms of actually checking whether they are usable, am I right is saying its just typically JS, so importing using require etc? I am new to using minified JS so not sure if there is something else to it.

#4

You should be able to use the functions within the library once you have set it up.
Have you checked out: Preloaded JavaScript and Libraries
" You can also pull in libraries from external URLs. For example, you could add papaparse by adding the URL https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.6.0/papaparse.min.js to the Libraries section. Then, you'll have papaparse available inside all your JavaScript queries, {{ }} , etc."

#5

I have checked that link out yes, I suppose there is some confusion from my end whether Ajv is even able to be used - I know libraries that have imports are not supported but I am unsure how to check this.

I have tried to use Ajv both in Javascript queries and the normal query editor with no luck...

#6

How would you go about using the Ajv module is maybe a better question for my understanding?

#7

@MatthewHole I have never used it and so I cannot answer that question - I was only trying to help you import it into your app... that being said, maybe another question would be to ask is what are you trying to accomplish that the already included libraries cannot do?

#8

@ScottR thats fair enough, no worries with that. I am just trying to validate some user inputted json against a schema before it is submitted and sent to our server over HTTP. I was no aware of the included libraries or where I can find a list. Is there one already given that I can use for this functionality? I am aware of the JSONSchema Form which I am using in other areas so I suppose there must be a JSON Library that can be used somewhere

#9

This is all I see:

Screen Shot 2022-09-27 at 10.35.23 AM
Screen Shot 2022-09-27 at 10.35.23 AM1468×168 51.1 KB

#10

Unfortunately I don't think they will help me with what I am trying to achieve, thank you for the help. I will try to get the libraries working if I can

#11

I think this community post will be helpful for you: https://community.retool.com/t/how-do-i-use-external-libraries/3742/3