Installing the UI5 CLI¶
- Node.js Versions 16.18.0, 18.12.0, or later
# Global installation to have the command available
npm install --global @ui5/cli
# Additional local install in your project
npm install --save-dev @ui5/cli
# Verify installation
The globally installed UI5 CLI will always try to invoke a locally installed version of the UI5 CLI (if present). This way you can use different versions of the UI5 Tooling across your projects. Please see the UI5 CLI documentation for details.
⚡️ Quick Start: OpenUI5 Sample App¶
Starting a New Project¶
The easiest way to start a new UI5 project is to use a template generator like generator-easy-ui5.
Choose a template that is designed for the type of project you want to create and the target environment where you want to deploy it to. Make sure that the template already uses UI5 Tooling. A good indicator for that is the presence of a
ui5.yaml file in the generated project.
When working with SAP Business Application Studio, there are several templates available to you. Check out the tutorial on creating a basic SAPUI5 application and deploying it to Cloud Foundry from within SAP Business Application Studio: Create an SAP Fiori App Using SAP Business Application Studio
You can find many guides on UI5 development with SAP Business Application Studio in the Tutorial Navigator.
Enabling an Existing Project¶
You can easily check whether or not a project (application or library) can already be used with the UI5 Tooling by looking for a
ui5.yaml file in the project's root directory.
This file (with some exceptions) is required for all projects and their dependencies (e.g. reuse libraries) to use them in the UI5 Tooling.
If your project is not set up for use with the UI5 Tooling yet, follow these steps:
If your project does not have a
package.jsonfile, let npm generate it:
npm init --yes
Define the framework you want to use
ui5 use openui5@latest
ui5 use sapui5@latest
You can choose between the OpenUI5 and the SAPUI5 framework.
Don't know which one to choose? Check out our documentation on the differences between OpenUI5 and SAPUI5.
Add required libraries
ui5 add sap.ui.core sap.m sap.ui.table themelib_sap_fiori_3 # [...]
You can find a documentation of all libraries, including samples and more, in the Demo Kit:
Start the server and work on your project! 🎉
If you are using Git or similar version control, commit
ui5.yamlto your repository.
git add package.json ui5.yaml git commit -m "Enable use with UI5 Tooling"