Scribd
Upload
677 views

Migrating SAP Fiori Apps From SAP Web IDE To SAP BAS

The document provides steps to migrate an SAP Fiori application from SAP Web IDE to SAP Business Application Studio: 1. Set up an SAP BAS environment by creating a subaccount, adding the BAS entitlement, subscribing to BAS, and assigning developer roles. 2. Create an SAP Fiori dev space in BAS. 3. Export the project from SAP Web IDE, unzip it, and drag it into the BAS workspace. 4. Add an 'xs-app.json' file, install dependencies, delete the 'ui5.yaml' file and recreate it, and build the project. The application is now migrated and ready for deployment in BAS

Uploaded by

edersondiniz
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
677 views

Migrating SAP Fiori Apps From SAP Web IDE To SAP BAS

The document provides steps to migrate an SAP Fiori application from SAP Web IDE to SAP Business Application Studio: 1. Set up an SAP BAS environment by creating a subaccount, adding the BAS entitlement, subscribing to BAS, and assigning developer roles. 2. Create an SAP Fiori dev space in BAS. 3. Export the project from SAP Web IDE, unzip it, and drag it into the BAS workspace. 4. Add an 'xs-app.json' file, install dependencies, delete the 'ui5.yaml' file and recreate it, and build the project. The application is now migrated and ready for deployment in BAS

Uploaded by

edersondiniz
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Migrating SAP Fiori Applications from SAP Web

IDE to SAP Business Application Studio


Introduction SAP Business Application Studio (aka BAS) is the evolution of SAP Web IDE. It is a
modular development environment, built on “Eclipse Theia”, an open-source IDE that embraces
the Microsoft VS Code experience. It aims to improve time to value of the developers, provide a
modern development experience and allow simple integration with SAP’s services and systems.
In this document I will guide you through migrating an SAP Fiori application from SAP Web IDE
to SAP Business Application Studio
Environment Setup
1. Create a subaccount in your global account or use an existing account and skip to Step three.

2. For trial account, Make sure that your subaccount has an SAP Business Application Studio
entitlement. If the entitlement is missing, add it from Entitlements menu.
3. Navigate to the Subscriptions menu and search for SAP Business Application Studio. Click on the
tile and click Subscribe.

4. Assign yourself to a developer role:


➢ Navigate to Security > Trust Conguration. ➢ Click the sap.default link. ➢ Enter your
email address ➢ Click Assign Role Collection.
➢ Select “Business_Application_Studio_Developer” from the dialog box
5. Create an SAP Fiori Dev Space ➢ Click Create Dev Space.
➢ Enter a name for the dev space
➢ Select the SAP Fiori type (from the left side).
➢ Click Create Dev Space.
➢ Launch the dev space by clicking on the dev space name.
6. Migrating your Project

• Click File > Open Workspace and create a workspace in the projects folder
• Export your project from SAP Web IDE Full Stack to your PC
• Unzip the project on your PC.
• Drag and drop the project to the SAP Business Application Studio
Here “UI5BasicControls” is my project done in SAP WebIDE. I have exported from SAP WebIDE, extracted and
dragged into my WorkSpace.

1. Create an ‘xs-app.json’ file under the project’s root folder and paste the below code to enable the
local run. This file replaces the ‘neo-app.json’ file.
•
• {
• "authenticationMethod": "none",
• "routes":
• [
• {
• "authenticationType": "none",
• "csrfProtection": false,
• "source": "^/sap/opu/odata/",
• "destination": "<YourDestination>"
• },
• {
• "source": "^(.*)$",
• "target": "$1",
• "service": "html5-apps-repo-rt"
• }
• ]
• }

Note:

In my case I have not added any backend connection routes as I have not any backend implementation for this
application. You must add the backend connection info if needed as per the syntax given above.
2. Install al dependencies
> cd <your_project_name> //to go inside your project directory
> npm install

> npm init

3. Delete “ui5.yaml” file and run below command


> ui5 init

This will create new ui5.yaml


4. Now build the project
> npm run build

That’s it. You have successfully built the project. Now this is ready for deployment.

You might also like