
Prerequisite: Set up SAP Business Application Studio.
Use: After completing this blog, you will be able to Load and initialize the SAPUI5 library to use SAPUI5 features.
Before we can do something with SAPUI5, we need to load and initialize it. This process of loading and initializing SAPUI5 is called bootstrapping.
Standard Bootstrap File
id :The id attribute of the <script> tag has to be exactly "sap-ui-bootstrap" to ensure proper booting of the SAPUI5 runtime.
src : The src attribute of the <script> tag tells the browser where to find the SAPUI5 core library – it initializes the SAPUI5 runtime and loads additional resources.
data-sap-ui-theme: The SAPUI5 controls support different themes.
data-sap-ui-libs: We specify the required UI library sap.m, which contains the UI controls we need for this tutorial.
data-sap-ui-compatVersion: To make use of the most recent functionality of SAPUI5 we define the compatibility version as edge.
Load Options
SAPUI5 can either be loaded locally with a relative path from an SAP Web server like :"resources/sap-ui-core.js" or externally from a Content Delivery Network (CDN).You can point to a specific version in a CDN, which allows you to select a fixed version for bootstrapping. To do this, assign a versioned URL like the following to the src attribute in the bootstrap script: https://ui5.sap.com/1.96.16/resources/sap-ui-core.js
Make sure that the index.html page now looks like this:
Note: If you run your application standalone, the bootstrap script is added to your HTML page. In an SAP Fiori launchpad environment, the launchpad executes the bootstrap and no additional HTML page is needed to display the application.
The head and body of the HTML page should now look like this:
Test run your application by starting it from the SAP Business Application Studio. Test run your application by starting it from the SAP Business Application Studio.
In the opened application, check if the Hello World text of the sap.m.Text UI element is displayed on the HTML page.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
9 | |
7 | |
7 | |
6 | |
5 | |
5 | |
4 | |
4 | |
4 | |
4 |