search

turutupa / cf-create-app

14 stars 3 forks source link

Feature requests - Integration with UI5 apps #16

Closed js1972 closed 3 years ago

js1972 commented 4 years ago

What a great tool. Thankyou!

Some awesome features would be:

turutupa commented 4 years ago

Hi Jason!

Thank you very much for your feedback and helping us improve our tool. In regards to the proposed features:

Thank you very much Jason and please do not hesitate to open more feature requests :)

js1972 commented 3 years ago

Hi @Turutupa I'm wondering how I could use this app generator with a fiori application. What adjustments would be necessary to the mta.yaml or xs-app.json, etc. I assume we can just drop a fiori app created with fiori-tools for example into the /app directory. But would that require adjustments to the html5 app deployer as well?

turutupa commented 3 years ago

Hi @js1972 ! Yes, you should be able to simply create the fiori app in the app folder for example and then modify the mta.yaml accordingly. As per your specific request on what adjustments should be made I must confess I don't know.

Fiori apps are still in our roadmap but unfortunately we've experienced some delays. Sorry I couldn't be of more help.

rlopmar commented 3 years ago

Hi @js1972, it should be quite straight forward, but all depends on how you are building your UI5 app.

In general, for any kind of HTML5 app you have to do only 2 things:

  1. Execute the script to create your application Build.
  2. Tell the HTML5 Deployer where is the Build folder.

For creating the application build, usually there is script in the package.json file, usually "npm run build" or similar. In the mta.yaml file you can list the commands you want to run before deploying in following block:

build-parameters:
  before-all:
    - builder: custom
      commands:
        - npm install
        - npx @sap/cds-dk build
        - npm --prefix ./app install ./app
        - npm run build --prefix ./app                #This line runs the build script

The last line runs the build script for a standard React project in the /app folder. If you script is different, then just change that line accordingly.

After that, you should have a folder where your build is located (usually named "build" or "dist"). You should specify that directory in the mta.yaml file, so the HTML5 deployer knows where to get the code to deploy.

  # --------------------- FRONTEND APP MODULE ---------------------
  - name: your-app-name-html5-app
    # ------------------------------------------------------------
    type: html5
    path: app                              # root path for your html5 app
    build-parameters:
      supported-platforms: []
      build-result: build                  # Path to the build folder relative to the root path of your html5 app

So the example above says the HTML5 app is in the <path_where_the_mta.yaml_file_is_located>/app folder, and after executing the build script, the Build will be in <path_where_the_mta.yaml_file_is_located>/app/build. Adapt this as per your configuration.

That should be enough for you to go and deploy the whole MTA app.

Some extra tips:

Cheers! Rafa

js1972 commented 3 years ago

@rlopmar thanks for the excellent explanation. Better than sap documentation!! ;-)