Apex Designer Documentation
What's New
Getting Started
Business Objects
User Interfaces
App Behaviors
Project Settings
Patterns and Best Practices
App Showcase
Frequently Asked Questions


Add Libraries and npm packages

Blank Profile Image
Written by Ashish Gupta
Updated 2 years ago
2 min read

You can add Libraries and npm packages (client and server side) to your project by going to the Dependencies page:

Dependencies page listing all dependencies


When you add a library, by default it picks up the latest version of the library but you can manually set the version range as needed:
Library dependency definition

  • ~version: “Approximately equivalent to version”, will update you to all future patch versions, without incrementing the minor version. ~1.2.3 will use releases from 1.2.3 to <1.3.0.
  • ^version: “Compatible with version”, will update you to all future minor/patch versions, without incrementing the major version. ^2.3.4 will use releases from 2.3.4 to <3.0.0.

warning icon indicates availability of any newer version.

lock icon on the Version Range indicates that only locked versions can be used in your project.

lock_open icon on the Version Range indicates that unlocked versions can be used in your project. When unlocked, you have an option to Auto-generate your project when the library is generated.

update icon allows you to apply the version range of the library

You can click on "Replace this library with a different library" and pick a different library, if needed. All the elements in your project from the old library will now refer to the newly selected library.

Library Order

If a library X has another library Y as its dependency, and you add library X before Y, Apex Designer will thrown an error for you to fix the order:

Warning message about mismatched dependency versions

NPM Dependencies

When you start typing the name of any npm package, the typeahead pulls up a list of all of the matching npm packages for you to choose from.

Client side NPM dependency list

When you select an npm package from the typeahead options, it automatically assigns the latest version to it. You can edit the version, if needed.

Client side NPM dependency definition

Configure the package

As per the ngx-mask documentation, this is the config option that you need:

  imports: [

You can add the above config option by clicking launch and then adding the config like this:

Configure the dependency package dialog

Open the package

You can click open_in_browser to go to the package url:

NPM Page about the added dependency


Powered by Apex Designer
Terms of ServicePrivacy Policy
© 2017-2024 Apex Process Consultants