Show TOC

Node.js-Based Development EnvironmentLocate this document in the navigation structure

Used for modifying OpenUI5. The environment is based on Node.js, used as a server, with a build process that is based on Grunt. This section provides information for the initial setup, development roundtrip, and tests execution.

The Regular Development Process

No build process is required, you can simply modify any source file and reload your browser.

This build-free development process does not deliver optimized runtime performance (for example, there are many small requests, which would not be acceptable for remote connections). There are mainly two mechanisms applied that adapt the sources:
  • The Git repository path contains a folder with the same name as the respective control library (for example, sap.ui.commons), which is omitted at runtime. The Node.js-based server is configured to map the locations.

  • The CSS files are transformed (server-side) by the LESS preprocessor during the first request after a CSS file has been modified. This includes mirroring for right-to-left support. After a CSS modification, this first request to the respective library.css file will take several hundred milliseconds, depending on the amount of CSS involved. This is the LESS processing time.

Building SAPUI5

Grunt is used to build a production version of SAPUI5. The build result is located inside the directory target/openui5.

Usage: grunt build

Optionally, you can choose to build selected libraries only or skip copying the test-resources folder.

Caution

As the build infrastructure is still being migrated from the old Maven-based one, the Grunt build does not yet have all desired capabilities. This means that the build result is not currently completely optimized for size and performance. If you intend to use SAPUI5 for productive purposes, we recommend using the runtime binaries provided at http://openui5.orgInformation published on non-SAP site.

The build process is responsible for the following tasks:

  • Creation of the bundled library.css and library-RTL.css file for all available themes

  • Minification of CSS

  • Minification of JavaScript (for library-preload.json files)

  • Combination of JavaScript control files into a single library-preload.json file

  • Combination of the most important SAPUI5 core files into sap-ui-core.js (not yet optimized; minification missing)