How to use External Libraries in Sisense Plugins [LINUX]

Step-by-Step Guide: 

Step 1: Understand how Sisense plugins load assets

Sisense plugins are loaded into the application at runtime and can include JavaScript, CSS, and static assets. External libraries can run alongside the plugin and may be imported from plugin files or loaded from a CDN, depending on security and deployment requirements.

Step 2: Decide how to include the external library

There are two supported approaches:

Local bundling (recommended)

Download the library and store it inside the plugin folder. This avoids dependency on external networks, improves version stability, and provides more control during development.

CDN loading

Load the library dynamically from a public CDN. This is faster to set up but depends on network availability and security policies such as CORS. You also need to choose a trusted CDN or host one yourself.

Local option: Add the library to your plugin folder

To use the local option, you must first understand that all files included in the plugin manifest are loaded immediately with the plugin. By default, many libraries expose themselves on the global window object, which allows them to be used globally. For example:

$(document).ready() // <-- $ is an instance of jQuery that exists on window, 
so it can be used everywhere.

When using a library inside a plugin, it is strongly recommended to attach it to the prism object, which is a globally reserved object instantiated by Sisense. For example:

prism.fuseSparkline = <Fuse.js min code>

By doing this, you create a namespace inside prism that allows the library to be reused across the application, especially within the plugin. We use fuseSparkline because we can be confident that no other object key is using it. To properly define this namespace, you need to include the library in the plugin manifest:

{
  "source": [
    "lib/fuse.min.js", // <-- The Fuse.js library code
    "main.js"
   ]
}

Load using scripts

When using a script-based approach to load the library, the library file is not defined as a namespace by default, so you should copy the full min.js code. With this approach, the loading behavior is similar to using an HTML <script> tag. A basic loader function looks like this:

function loadScript(src) {
  return new Promise((resolve, reject) => {
    const script = document.createElement('script');
    script.src = src;
    script.onload = resolve;
    script.onerror = reject;
    document.head.appendChild(script);
  });
}
// Load the library before using it
loadScript('/plugins/<plugin-name>/lib/fuse.min.js')
  .then(() => {
    console.log('Fuse loaded:', Fuse.version);
  })
  .catch(() => {
   console.error('Failed to load external library');
  });

This function ensures that the library is fully loaded before your plugin logic executes. The file path always follows the plugin path and the location where the library file is stored.

Load a library from a CDN

Using the same loader function, you can replace the local path with a CDN URL that hosts your library:

loadScript('<https://cdn.jsdelivr.net/npm/fuse.js@7.1.0>')
  .then(() => {
    console.log('Fuse loaded from CDN');
  });

⚠️ Use CDN loading only if your Sisense environment allows outbound network access and complies with your organization’s security policies.

Step 3: Use the library inside the widget or dashboard hooks

Once loaded, the library can be used in standard Sisense plugin contexts, such as widgets or dashboard scripts.

JavaScript code (widget lodash hook example)

widget.on('render', function () {
  const numbers = [1, 2, 3, 4];
  const doubled = _.map(numbers, n => n * 2);
  console.log(doubled);
});

Conclusion: 

Using external libraries in Sisense plugins is fully supported when done correctly. Bundling libraries locally is the safest approach, while CDN loading can be used selectively. Always ensure libraries are loaded before execution and test thoroughly across dashboards and widgets.

References/Related Content 

• Loading Amchart5 and Other External Libraries
• More About The Plugin Manifest
• How to build Plugins
• SisenseJS Native Libraries and dependencies

Disclaimer: This post outlines a potential custom workaround for a specific use case or provides instructions regarding a specific task. The solution may not work in all scenarios or Sisense versions, so we strongly recommend testing it in your environment before deployment. If you need further assistance with this, please let us know.