I'm having trouble determining the best way to import a third party library such as the Google Maps JavaScript API into a UI5 application. I have considered the following methods so far:
- Using a
<script>tag inindex.html, such as
<script src="https://maps.googleapis.com/maps/api/js?key=api_key"></script>
This works when testing locally but as mentioned in this SAP blog post, an app that is launched from the SAP Fiori Launchpad launches via theComponent.js, not theindex.html - That same blog post mentions importing a library via
sap.ui.define, which is in fact what I'm doing withmoment.jsalready in the application, which works. The problem is that the Google Maps API does not expose a global instance name / does not consist of a single JS file which can be imported, and thus this import fails. A similar question was asked in June last year but did not get answered. - A comment on that same question mentions using
require.jsto import the Google Maps API. This will likely work but seems like a hack. It feels like there should be some UI5-specific way to do this without having to import yet another third-party library. - Finally, this SAP blog post suggests manually creating and appending the Google Maps import
<script>tag into the DOM once the window has loaded. This also seems like a hack but might be the only way to achieve this for the time being.
Any help determining the correct method of achieving this would be appreciated!