Cannot execute loaded in page JS library nil in page context nor in JSReport context
-
Hello,
I want to use the Numeral.JS library to format my numbers in my template. I load the library with a <script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"> tag in page and the library is fully loaded (when I CTLR+clic on the link in JSReport Studio, the script appears in another tab ot the browser). I gave the properly configuration in jsreport.config.json file to enable external scripts. This library seems to use a factory function to load the 'numeral' function in the page. I checked it in a usual web page with a web server and the 'numeral' function appears and works properly.
I try to use it in JSReport but it doesn't work. I tried to put the script inside the JSReport server side context like this:
function prix(price) { if (price != 0) { return numeral(1000).value(); } }
But I got this error:
'numeral' not defined
I tried to add in the same context this line ouside of this function:
var numeral = require('numeral');
But I got this error:
cannot found 'numeral' module
even if I ran 'npm install numeral' at the root path of jsreport directory. I tried to put my script in a <script> tag in the page template like:
<div id="test"></div> <script> var div = document.getElementById('test'); div.innerHTML += 'Hello! ': var num = numeral(1000); div.innerHTML += num.value(); </script>
But the second part of the message didn't appear. When I change my script like:
<div id="test"></div> <script> var div = document.getElementById('test'); div.innerHTML += 'Hello! ': var num = numeral(); div.innerHTML += typeof num; </script>
I got as result:
Hello! undefined
I read a post in the forum about the distinction between the in page context and the server side context who helped me to understand a bit how jsreport work. But I am stucked. I cannot think that I cannot use an external JS library in a page in JSReport. I probably missing something obvious. I am completely newbie with JSReport (and NodeJS) but not in web programming.
Best regards
-
There are two contexts. Templating engine and chrome page evaluation. Both work differently and need a different approach to link the library.
- Templating engines.
- allow external lib using for example config "allowLocalFilesAccess":true
- npm install library
- in template helpers section do
const lib = require('libary') function myHelper () { return lib.foo() }
- chrome page evaluation
This is a normal web page like any other. So you can link script from cdn like
<script src="https://acdn.com/mylibary"></script>
and then reach it in the global scope
<script> myLib() </script>
or you can also download the whole js script, upload it as an asset to the jsreport studio and then link it using
<html><head><script>{#asset myAssetName}</script>...
-
Hello,
Thank you for your hints. I finally found that jsreport is based on handlebars library and found that handlebars-intl format numbers and currencies with locale. I installed the last one with npm and use the template functions directly inside my page and it works fine.
Best regards