2

We are currently building a set of apps, where there is a lot of reuse.

Currently we got it working by using jQuery.sap.registerModulePath and jQuery.sap.require. But according to Using and Nesting Components you should be able to declare your reuse components in the manifest.json file.

I had a look in the SAPUI5 Developer Guide, but couldn't really make it work. As far as i can see I need to add the following:

"sap.App" :{
    "embeddedBy" : "../.."
},
"sap.ui5": {
    "componentUsages" :{
        "<string for my reuse component>" : {
            "name" : "<name of the component>"
        }
    "dependencies" :{
        "components" : {
            "<namespace of my component>"
         }}

Anyone got a working example?

Jakob Marius Kjær
  • 70
  • 1
  • 2
  • 8

1 Answers1

3

Here is a working example with nested components: https://embed.plnkr.co/e7KS48/

The descriptor attribute componentUsages is available since 1.47.0. Once defined, UI5 takes care of resolving the Component and its module path before rendering the owning ComponentContainer.

ComponentContainer is needed because a Component cannot be placed into the UI without a container. In my example above, the Container is defined declaratively in Home.view.xml with the respective usage property.

<core:ComponentContainer id="containerForChildComponent"
  autoPrefixId="true"
  settings="{id: 'childComponent'}"
  usage="reuseAnotherComponent"
  manifest="true"
  height="100%"
  async="true"
/>

"sap.ui5": {
  "componentUsages": {
    "reuseAnotherComponent": {
      "name": "anotherComponent",
      "lazy": false
    }
  },
  "resourceRoots": {
    "anotherComponent": "./component_B"
  },
  // ...
}

As you can see, the resourceRoots can be also defined in the descriptor which could point to other component / app locations.

Example for UI5 apps w/ version below 1.47: https://embed.plnkr.co/ytXZJ9

Boghyon Hoffmann
  • 17,103
  • 12
  • 72
  • 170
  • Awesome, it worked! I would love to get rid of the jquery.sap.registerModulePath, but i guess i can't have it all. – Jakob Marius Kjær Sep 27 '17 at 00:27
  • @JakobMariusKjær `resourceRoots` also registers module paths as explained [here](https://stackoverflow.com/a/46270607/5846045) if that's what you wanted.. If you want to avoid registering additional namespaces altogether, the child component has to know the namespace of its parent component which, however, defies the purpose of having separated components because of the tight coupling. In my original [example](https://embed.plnkr.co/e7KS48/), the child component has no clue about parent's namespace (besides the optional `parent`s in `sap.ui5/routing/routes`). – Boghyon Hoffmann Sep 27 '17 at 23:29