Show TOC

Registering Component ResourcesLocate this document in the navigation structure

The jQuery.sap.registerModulePath or sap.ui.localResources make the location of a component's resources known to SAPUI5.

The component and all its resources, the components, views, controllers, controls, css files, JavaScript modules, and so on, can be located in different locations (paths and web applications) and not directly under the default application root, for example index.html. By default, SAPUI5 tries to load the resources relative to the location where the sap-ui-core.js bootstrap is located. To include resources from different locations, for example via jQuery.sap.require, the namespace of the modules needs to be mapped to another location.

The application root is the location of the HTML page. The application root of an application located at /uilib-sample/test-resources/sap/ui/mylib/MyTableComponent.html is, for example, /uilib-sample/test-resources/sap/ui/mylib/. The paths to stylesheet and JavaScript modules are loaded relative to the application root.

The resources root is the foundation for jQuery.sap.require(); and is defined relative to the application in the application's bootstrap:

<SCRIPT SRC="../../../../resources/sap-ui-core.js"> 

The resources root in this example is ../../../..resources

The following code loads ../../../../resources/sap/ui/table/Table.js, the resources root, name space and prefix: jQuery.sap.require("sap.ui.table.Table");. To get the resources path to the module, use jQuery.sap.getModulePath(Namespace).

It is common that your JavaScript modules, for example Component.js are located not directly under the application root but, for example, in the component folder /uilib-sample/test-resources/sap/ui/mylib/example/component/Component.js. In this case, you register your module by using sap.ui.localResources or jQuery.sap.registerModulePath.

If the namespace matches the path, use sap.ui.localResources(sNamespace). In the example above, the sNamespace is example.component and the path is example/component/. Components and any other managed resources in SAPUI5, such as views, controllers, controls, JavaScript modules and CSS files, whose resource name starts with sNamespace, are loaded from an equally named subfolder of the application root folder. If the resource name consists of multiple segments separated by a dot, each segment is assumed to represent an individual folder: If resource name is converted to a URL, any dots ('.') are converted to slashes ('/').

The following code snippet shows an example:

// Let UI5 know that resources, whose name starts with "com.mycompany.myapp"
   // should be loaded from the URL location "./com/mycompany/myapp"
   sap.ui.localResources("com.mycompany.myapp");

   // The following call implicitly will use the mapping done by the previous line
   // It will load a view from ./com/mycompany/myapp/views/Main.view.xml
   sap.ui.view({ view : "com.mycompany.myapp.views.Main", type : sap.ui.core.mvc.ViewType.XML});

If the application needs a more flexible mapping between resource names and their location, use the following code:

jQuery.sap.registerModulePath("my.example.component", "example/component/"); 

After the registration, SAPUI5 knows multiple resources locations for different namespaces:

		RESOURCE ROOT: { 
			"": "../../../../resources/" 
			"example.component": "example/component"
			"my.example.component": "example/component/"
		}