How to create an extension project in BAS?
If you tried to create Extension project in 2025 in Business Application Studio (BAS) for a standard application, I feel you pain. It seems that everyone fully switched the focus to Adaptation projects and there is a little to no information on Extension projects in BAS.
However, there is a number of applications that do not support enhancements via Adaptation project, so we still must be able to perform Extension projects as well.
In this article we will go through the process of implementing an Extension project in BAS using the standard S/4HANA app Pack Warehouse Stock as an example.
Creating the extension project
There is a template for extension project, however, it is hidden behind the adaptation projects. So, in order to start from the template, please:
- Navigate to Help -> Get Started.
- Press New Project from Template.
- Choose SAPUI5 Adaptation Project, press Start >.
- Select ABAP environment, press Next >.
- Select the corresponding system. Search for "Pack Warehouse...", select our Pack Warehouse Stock app.
- Here you should be able to see the option to create Extension project instead of Adaptation project. The generator automatically detects syncronous views and gives us this option. Select Yes for the Extension project, press Next >.
- Fill in project basic information, press Finish to close the generator.
- Generator can create the files, however, it usually fails to open the right folder and install the dependencies. Therefore, manually open the created folder in BAS.
Installing dependencies
Use the following command to install the dependencies:
npm i
You can try to run the project with npm run start
, but as of March 2025 it
would fail due to generator bug with the following error:
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'Component') at Component.js:13:27
Fix the component path
Open webapp/Component.js
file. Modify the component name (remove .av1
suffixes from the controller's name):
jQuery.sap.declare("customer.app.variant7.Component");
// use the load function for getting the optimized preload file if present
sap.ui.component.load({
name: "scm.ewm.packoutbdlvs1",
// Use the below URL to run the extended application when SAP-delivered application is deployed on SAPUI5 ABAP Repository
url: "/sap/bc/ui5_ui5/sap/EWM_PKODL_MANS1"
// we use a URL relative to our own component
// extension application is deployed with customer namespace
});
scm.ewm.packoutbdlvs1.Component.extend("customer.app.variant7.Component", {
metadata: {
manifest: "json"
}
});
Make sure to adjust customer.app.variant7
to your application paths.
This will allow us to start the application:
npm run start
Add controller extensions
Right click on .extconfig.json
file. Choose Create Extension. Extension creation wizard will open:
- Choose Extend controller, press Next.
- Select the right controller, for example,
DefaultBin
. Select Replace with: Copy of the original Controller. Press Next. - Press Finish. This will generate the files, however, as of March 2025 there are bugs in the generator again.
You can see the new file DefaultBinCustom.controller.js
appeared. After we
fix the bugs, it will be used to override the standard controller.
Fix controller path in manifest.json
Remove .av1
suffixes from the component and the controller in the manifest.json
:
"extends": {
"component": "scm.ewm.packoutbdlvs1",
"extensions": {
"sap.ui.controllerExtensions": {
"scm.ewm.packoutbdlvs1.controller.DefaultBin": {
"controllerName": "customer.app.variant7.controller.DefaultBinCustom"
}
}
}
},
Make sure to adjust customer.app.variant7
to your application paths.
Now the app will try to load the extension but will fail with an error in the console:
[FUTURE-FATAL] Attempt to load Extension Controller customer.app.variant7.controller.DefaultBinCustom was not successful - Controller extension should be a plain object.
Fix custom controller return
As the app requires a plain object, change the return statement from the full extended class to just a plain object with the methods to override:
sap.ui.define([
...
], function (C, M, S, G, U, a, J, b, P, c, F, d, e, O) {
"use strict";
...
return {
init: function () {
alert("it works!");
...
While at it, you can also add alert("it works!")
in one of the method contents to
see it finally working.
Deploy to SAP S/4HANA
To be continued...
Verified systems
- SAP S/4HANA 2023
- SAP BTP
Provide feedback
If you have comments or suggestions, please feel free to:
- Reply on X/Twitter.
- Leave a comment on our Telegram Channel.