How to add External Libraries to a SAP Fiori Elements App .

[Abhi9]

Hi,

I am trying to integrate third party libraries to SAP Fiori Element App.

App is launched via FLP. It's not loading the libraries properly when it is loaded via extended controller file or from Component.JS.

As of now I am trying to load it via onInit or onBeforeRendering to load let's say a google map via CDN.

UI Version: 1.108.23

jQuery.sap.includeScript("https://maps.googleapis.com/maps/api/js?key=""&loading=async&libraries=geometry", 'googleMaps', this.initializeMap.bind(this));

initializeMap: function () {
			var map = new google.maps.Map(this.getView().byId("idmap").getDomRef(), {
				center: { lat: -34.397, lng: 150.644 },
				zoom: 2
			});
		}

Also, in a different scenario when app to app navigation is enabled ...unless there is hard refresh on the second app's object page where a third-party library is loaded...it is not loading the library.

Wondering if it's a Bug or a known issue which is resolved. 

Any recommendations. @pmuessig 

Thanks,

Abhi

[MioYasutake]

@Abhi9 

Have you tried ui5-tooling-modules? (I haven't tried using it inside a Fiori elements app)

[Abhi9]

Hi @MioYasutake  .. TBH i didn't get a chance in any of my production apps to use UI5-Tooling-Modules . If it is a standalone app i use CDN script tag in index.html ... if it is launched via FLP i use jquery.sap.includescript()/sap.ui.dom.includescript() which worked fine but those are not Fiori Element Apps... mostly custom UI5 apps.

But i did try to implement using UI5-Tooling based on https://community.sap.com/t5/technology-blogs-by-sap/using-npm-packages-in-ui5-without-shims/ba-p/13... which again in S/4 FLP it is causing issues.