How to create SAPUI5(Fiori) library in Web Ide?

[Former Member]

Dear experts,

Could you please advise how to create properly a custom library in Web IDE?

What I found is a description like this:

SAPUI5 SDK - Demo Kit

However here is completely unclear how to create properly a project.

Should I create only manifest.json or .library or both of them?

Also I noticed: there is a special project type Fiori library in Web IDE but it's not active and it's not possible to choose it.

[Attila]

Hi Petr,

did you manage to create your own reusable library ? I would like to do the same, instead of including every time the same in our customer applications. Any advice is welcome .

What I'm thinking of, is to put the custom modules developed into a new public folder in the MIME repository on the gateway system,like SAP does it. Here is the path to the standard library below. When you patch UI5 libraries with report /UI5/UI5_UPLOAD_PATCH_TO_MIME, this folders are written.

The way to define a library properly, which could be referenced using jQuery.sap.require for example is unknown for me. WebIDE seems not providing a plugin/option for us customers to do it, but would significantly reduce redundancy and maintenance costs of customer applications. We could ignore to include the same functionality across applications within the same modules like FI,PS etc. If a manual step-by-step description would be available, I would go ahead and do it, to save implementation costs and keep consistency across our apps.

[Former Member]

Dear Attilla,

I don't pretend my way is good one, but here is how we did it:

1) What we did first - we created a new SAPUI5 project for a library us.mob.lib. We placed library.js file inside us/mob/lib folder with just the dummy code:

sap.ui.define(['jquery.sap.global',
'sap/ui/core/library', // library dependency
'sap/m/library',
"us/mob/lib/util/sbtIcons"], // referenced here to enable the Support feature
function(jQuery, CoreLibrary, MLibrary, initIcons) {
sap.ui.getCore().initLibrary({
name : "sbt.mob.lib",
dependencies : ["sap.ui.core","sap.m"],
interfaces: [],
controls: [
],
elements: [],
version: "0.0.0"
});

        initIcons();
});

You can initialize your library inside the function. We didn't create any other descriptor like manifest or .library as they are ignored anyway.

2) Inside this library we put all common controls and modules and deployed it as a usual sapui5 application to ABAP server.

3) Then on the other side in the apllication that should use it we inserted the following code in the compoent.js before component definition:

// redirect library path
jQuery.sap.registerModulePath("us.mob.lib",
 "/sap/bc/ui5_ui5/sap/zus_mob_lib/us/mob/lib/");
sap.ui.getCore().loadLibrary("us.mob.lib");


sap.ui.define([ ... here you declare the component 

Then you can use "us/mob/lib/..." references in all views and modules inside your porgram.

This way is not time consuming it all - we just create a separate project and deploy it like we used to do.

But.. here is where we have a gap. This is theming. We use our own customer theme. And we didn't find a documented way to make our library themable.Moreveor SAP even replied us that it's not supported feature.

Meanwhile we found a workaround.

we have a separate project for theme.

By default it contains Base and UI5 folders. There is only sap folder inside UI5 initially. Now we created us/mob/lib/themes/our_theme_name path inside UI5.There we put library.css file into there.

After deploying such a theme it successfully implemented customer stylesheet for our controls.

Main disadvantages of the following approach are:

1) We can't use less files in theme - they are just ignored by theme tool while uploading for a customer namespace.

2) We have to maintain library and theme in different projects.

I hope you will find my response useful. Will be glad to have alternative solutions.

[Former Member]

What about using using MIME repository. Yes - you're absolutely right about that.

Some time spent on debugging led us to here. To make library themable you have to create it in sap.* namespace and to upload it to MIME manually.

This makes build process very complicated and what's more important ruins the consistency.

Which is my vision - this is a task for SAP to preapare an easy way to upload libary inculding updating MIME directly from Web IDE.

[Attila]

Dear Petr,

reading your explanation, I've a much better understanding now. You showed me the critical points, but as I can see you solved all of them, and it is up and running, which is a great job. Your description is very valuable, and helps us a lot. Thank you very much, taking the time and sharing this information.

Best Regards

Attila

[former_member186879]

Hi Petr,

We currently don't provide any sort of assistance in Web IDE for creating Fiori libraries.

This capability is currently in development stages and only available internally, this is why you are unable to select this project type in Web IDE.

Thanks,

Uri

[michal_keidar]

Hi - can you please assist?

Thanks,
Michal.

[Former Member]

I have to notice - I mean a library that is supposed to be deployed on ABAP server and to re reused in customer apps.

That's completely unclear where is the mapping between library component name like "my.com.lib" and SICF node like ZMY_COMP_LIB