Skip to Content
Technical Articles
Author's profile photo Bollu Spandana

How to run the application in SAP Fiori Launchpad Environment using SAP Business Application Studio(BAS).

Hi All,

Whenever I try to execute the SAP application through run configuration, I generally face an issue due to the absence of a Fiori launchpad.

In this blog, I am going to explain how we can overcome the above-mentioned drawback and execute the SAP application in a Fiori Launchpad by using SAP BAS.

Step 1:

Here I have created a sample application with the name SampleApp by using the SAPUI5 Application template.

After the creation of the project, the structure will be as shown below.

Step 2:

Now I want to run this application (SampleApp) for which I need to add the run configuration.

Steps for adding Run Configuration:

Click on the Run button and click on the create configuration shown below.

 Select the project name which we would like to run.

After selecting the project, now we must select the index.html runnable file (As we don’t have any direct option to run the app with Fiori Sandbox).

Select the version from the available versions.

 Click on enter to add the run configuration shown below.

Click on the run module.

Now click on the open in new tab button to run our application in index.html as we have selected the index file during configuration time.

Now I want to run this application in Fiori launchpad.

Open run configuration file and right-click on the file and select the show in file option to open the launch.json file shown below.

In the args section in the launch.json file we need to make the below changes:

“args”:[

“—standalone”,

“/comsampleSampleApp/index.html”

Replace the above-mentioned arguments below.

“args”: [

“–flp”,

“–relative”

Now the updated code will be shown below.

Note: If the target run time is cloud foundry, the dependency is located in the root folder, at that time have to update the dependencies in package.json like below.

dependencies>@sap/html5-remo-mock to 1.6.x.

otherwise, we don’t need to update any dependencies in package.json.

Again, run the application through the run module to open the launchpad like below.

 

Now click on the sample app tile to open the app in Fiori Launchpad.

                So, in this way, we can easily run the sap application in the Fiori   Launch pad by using SAP BAS.

 

Assigned Tags

      12 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Enric Castella Gonzalez
      Enric Castella Gonzalez

      Great post,

       

      Congrats Bollu

      Author's profile photo Bollu Spandana
      Bollu Spandana
      Blog Post Author

      Thank you so much Enric Castella Gonzalez

      Author's profile photo F Calceus
      F Calceus

      We need to thank Bollu for sharing.

      Author's profile photo Bollu Spandana
      Bollu Spandana
      Blog Post Author

      Thank you and your welcome 

      Author's profile photo Chandra bandi
      Chandra bandi

      hi Spandana,

      I am getting below error, after modifying arg section.

      Error: Failed to load Fiori Launchpad Sandbox configuration from /appconfig/fioriSandboxConfig.json: status: error; error:

      and after tile click below error is coming(Failed to load UI5 component for navigation intent "#zt_BC_SAzt_BaseCont_singleApp-Show").From the console I can see error:

      component for navigation intent #zt_BC_SAzt_BaseCont_singleApp-Show - failed to load 'zt_BC_SA/zt_BaseCont_singleApp/Component.js' from /zt-BC_SAzt_BaseCont_singleApp_1.0.0/Component.js: script load error
      Error: failed to load 'zt_BC_SA/zt_BaseCont_singleApp/Component.js' from /zt-BC_SAzt_BaseCont_singleApp_1.0.0/Component.js: script load error

       

      Thanks,

      Chandra.

      Author's profile photo Yen Shen, Ben Lim
      Yen Shen, Ben Lim

      Hi Chandra,

      I'm also facing similar issues as your. Did you manage to resolve it?

      Regards,

      Ben

      Author's profile photo Ricardo Varela
      Ricardo Varela

      had you able to solve this? if that is the case can you share your solution please?

      Author's profile photo Ekansh Saxena
      Ekansh Saxena

      Hi Bollu Spandana ,

      Thanks a lot for such a valuable information. This is most likely missing in the documentations. I am able to run FLP with a new UI5 project created in BAS but I have two questions:

      1. the FLP is always using the latest UI5 version but I need to test my app with an older version. Do we have such possibility with this config?
      2. FLP opens up pretty nicely when I perform the above mentioned config changes in an app created directly in BAS but it doesn't spin up when I perform the said changes in an app migrated manually from WebIDE. Am I missing something in this case?

      BR, Ekansh

      Author's profile photo Eliu Gonzalez
      Eliu Gonzalez

      Hi Ekansh Saxena,

      for the UI5 version, you can set up in the ui5.yaml file:

       

       

      for your second point, did you run the command "Fiori: migrate WebIDE project for use in fiori tools" ? if yes, then what I do, it to mimic(copy & paste) the package.json, ui5.yaml and run manually in the terminal the node command "npm init"

      I hope it helps

      best regards

      Author's profile photo Eliu Gonzalez
      Eliu Gonzalez

      great Post!!

      one question if do we want to set another language instead of English, is there a parameter to achieve it?

      thanks in advance

      Author's profile photo Ricardo Varela
      Ricardo Varela

      Hey, i followed all the steps but, at the moment i want to execute the app in FLP sandbox(pressing the app tile) this error appears(see attached image)error%20when%20pressing%20tile

      error when pressing tile

      Can anyone help me indicating what could i've been doing wrong?

      Author's profile photo Venkatesh Hulekal
      Venkatesh Hulekal

      Hi Ricardo,

      Were you able to find any solution for this?

      Thanks