Deploy a custom UI5 library in SAP BAS

3.1k views Asked by At

I need to build some custom Fiori libraries with SAPUI5.

On the internet, I found many tutorials about how to build such libraries but no tutorial shows how I can deploy it. The only tutorials I found about the deployment are using the old Web IDE but we're using the SAP BAS (SAP Business Application Studio) which doesn't have those functions.

So then I learned about how SAP handles the custom libraries and tried to deploy it like a normal Fiori app by creating a ui5-deploy.yaml:

specVersion: '2.5'
metadata:
  name: 'zcalibtest'
type: library
builder:
  resources:
    excludes:
      - /test/**
      - /localService/**
  customTasks:
    - name: deploy-to-abap
      afterTask: generateCachebusterInfo
      configuration:
        target:
          destination: {DESTINATION}
          url: {URL}
        credentials:
          username: env:DEPLOY_USERNAME
          password: env:DEPLOY_PASSWORD
        app:
          name: Z_CA_LIB_TEST
          package: ZCA_TEST
          transport: {TRANSPORT}

... and running the following NPM "deploy" script:

npm run build && fiori deploy -y --config ui5-deploy.yaml && rimraf archive.zip

But that gives me the following error:

sh: 1: fiori: not found

So I think that's not the way to go. But how can I do this? I couldn't be the only person on the planet that is using SAP BAS and tries to deploy a custom library.

Edit:

My package.json file:

{
  "name": "zcalibtest",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "@ui5/cli": "^2.9.3",
    "@sap/ux-ui5-tooling": "^1.5.5",
    "karma": "^6.1.1",
    "karma-chrome-launcher": "^3.1.0",
    "karma-cli": "^2.0.0",
    "karma-ui5": "^2.3.3",
    "ui5-middleware-livereload": "^0.5.1"
  },
  "ui5": {
    "dependencies": [
      "ui5-middleware-livereload"
    ]
  },
  "scripts": {
    "build": "ui5 build --clean-dest",
    "deploy": "npm run build && fiori deploy -y --config ui5-deploy.yaml && rimraf archive.zip",
    "start": "ui5 serve --open test-resources/path/to/lib/zcalibtest/Example.html",
    "testsuite": "ui5 serve --open test-resources/path/to/lib/zcalibtest/qunit/testsuite.qunit.html",
    "test": "karma start --browsers=ChromeHeadless --singleRun=true"
  },
  "license": "UNLICENSED"
}
1

There are 1 answers

7
Cmdd On

For the deploy part: you need to add the package "@sap/ux-ui5-tooling" (both in your devDependencies and in your ui5 dependencies) and rimraf (only in your devDependencies).

For the build part: build steps for libraries are slightly different so yours should be similar to these (maybe you don't need all the steps..). For the building part you need to add only bestzip to your devDependencies I guess

"scripts": {
    "build": "npm run clean && ui5 build --include-task=generateManifestBundle generateCachebusterInfo && npm run flatten && npm run clean-after-flatten && npm run zip",
    "zip": "cd dist && npx bestzip ../ExampleLibrary-content.zip *",
    "flatten": "cp -r dist/resources/name/space/examplelibrary/* dist && cp dist/resources/name/space/examplelibrary/.library dist ",
    "clean": "npx rimraf ExampleLibrary-content.zip dist",
    "clean-after-flatten": "rm -rf dist/resources dist/test-resources"
}

You can find more info about building libraries in this blog post from the SAP Community.