Javascript Injection and JS Libraries dependencies from external

Atlassian Developer Tools
,
1

Hi All,

I have to build a small plugin for Jira/Confluence in order to inject JS.

I am aware about Web Resource module type that allows to inject JS depending the different context of the application. It allows to inject a based on an aggregate of JS source from the Application, where the declared dependencies are analysed in order to have the correct JS.

The generated html looks like

<script type="text/javascript" src="/confluence/s/71095c56c641f2c4a4f189b9dfcd7a38-CDN/en_US/8100/5084f018d64a97dc638ca9a178856f851ea353ff/3.1.1/_/download/batch/confluence.extra.livesearch:livesearch-macro-web-resources/confluence.extra.livesearch:livesearch-macro-web-resources.js?locale=en-US" data-wrm-key="confluence.extra.livesearch:livesearch-macro-web-resources" data-wrm-batch-type="resource"></script>

But, how to process if a part of this injected JS has external dependencies not stored on the application. In final, I expect to have

<script language="JavaScript" src="https://other.copany.com/js/SomeLibrarie.js"></script>

Any idea ?

Thanks

2

I think there are two approaches you can follow here:

  1. include the dependencies using bundlers (like Webpack). In this case, all 3rd party dependencies are installed with npm install <package> (i.e. npm install jQuery) and included in your source using require('jQuery'). The bundler will include an integral copy of the code from jQuery in your output.js file which is then loaded by Confluence.

  2. use an runtime resolution library like requireJS or more lightweight script loaders (search npmjs.org for “load script” or just “script”) which will basically add dynamic <script src="" /> tags on load.

1 Like
3

Thanks for these informations.
I will study them.
Vincent