Skip to Content

SAPUI5 loading multiple external libraries

Hi,

I'm having a problem loading multiple libraries in my UI5 project, I've tried loading them in the controller, in the component.js and in the manifest and I get the same result each time... it only loads the first library and then I get an error !

the libraries are from amCharts ... https://www.amcharts.com ... has anyone used these successfully in their projects?

Controller example:

sap.ui.define([
	"sap/ui/core/UIComponent",
	"sap/ui/Device",
	"znrw/amCharts/model/models",
        "libs/core",
        "libs/charts",
        "libs/animated:
], function (UIComponent, Device, models, core, charts, animated) {
	"use strict";

etc...
Manifest example:

		"resources": {
			"js": [
				{
            		"uri": "libs/core.js"
        },
        				{
            		"uri": "libs/charts.js"
        },
        				{
            		"uri": "libs/animated.js"
        }
        ],

Both of these methods result int he same problem as reported in the browser console:

The issue is most likely caused by application znrw.amCharts. Please create a support incident and assign it to the support component of the respective application. - Failed to load UI5 component with properties: '{
    "asyncHints": {
        "waitFor": []
    },
    "name": "znrw.amCharts",
    "url": "../../../../../webapp",
    "id": "application-Test-url-component",
    "componentData": {
        "startupParameters": {}
    },
    "async": true
}'. Error likely caused by:
TypeError: Cannot read property '1' of null
Add a comment
10|10000 characters needed characters exceeded

Related questions

4 Answers

  • Posted on Apr 19, 2019 at 02:51 PM

    Hi Neil,

    If my understanding is correct you want to use external JS Libraries in SAPUI5. Try following below steps :

    1. Download the minified file of external JS library which you want to use.
    2. Create new Folder in SAPui5 application hierarchy under webapp
    3. Create new file and paste minified code OR just include that external Minified JS file
    4. Now go to the controller.js file of View where you want to use that External JS library functionality and add provide path/location of external JS file under SAP.UI.DEFINE([ "External Lib path" ])
    5. You also need to pass new parameter in Function (Controller, ExternalJS)
    6. If you still see some Error try adding /* global <External Library Name>:true */ on top of your Controller file where you want to use this External JS

    You can follow same approach for all external files you want to use.

    Hope this helps.

    Thanks-

    Abhishek

    Add a comment
    10|10000 characters needed characters exceeded

    • Hi and thanks for answering.

      I have already created the folder in my project and uploaded the js files for the libraries there.

      As you can see from my first code example above, I have tried to load them in the controller using the method you described,this didn't work either... since however, I want to use these libraries in multiple places in my app, I believe loading them in the manifest is the preferred option.

      The problem is that only the first library seems to get loaded, and then I get an error message... the second two libraries are dependent on the first.

      Perhaps there is more info required in the manifest, resourceroots maybe..? Not sure how to set that?

      Interestingly ... if I run the app with the index.html, it works! however since my app will be deployed to the FLP, I cannot use that :(

      Any one got any ideas?

  • Posted on Apr 22, 2019 at 03:47 PM

    Hi Neil,

    You can add dependencies in manifest.js file like below

    dependencies: {
        libs: ["sap.m", "sap.ui.layout", "External Lib path"],
        components: ["External Lib path"]
    }

    your library should be in resources folder.

    Once done then you can register (registerModulePath) the path where your external library will be found. Please have a look to documentation below :

    https://help.sap.com/saphelp_uiaddon10/helpdata/en/9c/5a9619f69f4a819f91fc89d9ff56f1/content.htm?no_cache=true

    Reference link :

    https://archive.sap.com/kmuuid2/a0b41949-b803-3210-6bba-dc97da1ac623/SAP%20Fiori%20Launchpad%20for%20Developers%20-%20Architecture%20Overview.pdf

    Hope this helps...

    Thanks-

    Abhishek

    Add a comment
    10|10000 characters needed characters exceeded

  • Posted on Aug 27, 2019 at 07:46 AM

    Hi Neil,

    Have you found out the reason. I am facing exactly the same scenario & error.

    Kindly share the solution for this error.

    Regards,

    Deep

    Add a comment
    10|10000 characters needed characters exceeded

    • Hi Deep, there was no solution I'm afraid.

      I logged a ticket with SAP and they checked out my issue and we determined that it was not possible to load these libraries using the manifest method...

      So I ended up loading them via the main controller in my app.

  • Posted on Sep 03, 2019 at 08:40 PM

    first wrap your stuff as lib in ui5(google how to make a lib in ui5.), then the loading through manifest will work.

    Add a comment
    10|10000 characters needed characters exceeded

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.