The Dependency Manager is used for managing the order of loading assets to Angular-based applications.
Loading resources is possible any time it is required on the project (not only while loading the app), for example, when switching to a specified routing.
The Dependency Manager also provides the option of defining the modules dependencies, sequencing the added files in the necessary order.
Dependency Manager overview
In this view, there are four sections with information on:
- Libraries version
- Built-in resources
- External resources
- Internal resources
External resources section
Here, for the
URL, you can choose to use a relative path or a
.js URL from third-party domains.
Configuring the relative path can be useful when connecting third-party libraries and modules (from third-party domains or the ones added to the
.js file cannot be added to the project and is to be loaded with starting the project (for example, Google Maps or APIs of payments systems).
To do it, define the dependency name, its external resource
URL or a relative path to the
.js file, and select the dependency type (
Angular service or
Here you can also learn how theme resources can be added to the source.
Internal resources section
This section contains a table with
Directives that have been added to the app and are arranged in the order they were added to the project and, below, all the system libraries (
System) used in the app (for example,
cordova, etc.) are listed.
The list of system libraries is defined by the
Libraries version of the project and cannot be modified (with the exception of some Angular modules).
Check the corresponding box to show system resources and leave it unchecked to hide them.
The dependency table fields include:
- Group (
- Type (
System module, etc.)
- Enabled (resource is active)
- Global (resource is connected while loading application)
- Shim (used to configure the dependencies, exports, and custom initialization for older, traditional
browser globalsscripts that do not use
define()to declare the dependencies and set a module value)
- Shim exports
- Shim init code
More on configuring
Shim exports, and
Shim init code fields can be found here.
dependencyname differs from that of the
Angular module, the
Angular modulename must be specified in the
The Dependency manager offers several options of loading assets and external libraries:
- resource is added while loading application
- resource is added while selecting the specified route
- resource is added after the related dependency is loaded
The initial settings of the resources to be loaded (
CREATE NEW > ... ).
There are some distinctions in their configurations, though.
.js file with further editing, create it with entering the
URL, or upload from file along with selecting the resource type (
Angular filter, or
External lib) and defining the dependency table fields (
All the Dependency Manager settings can be changed later under
App Settings > Resources.
Adding AngularJS module to Appery.io app
Let’s add this AngularJS module to your app:
Click Download ZIP to download the module to your computer.
Create a new AngularJS app.
ZIP bundle and click Upload files to add the archive the
angular-pickadate-master.zip.It will be unzipped automatically to the
libs folder when uploaded.
There is a folder
dist that contains all the necessary
Project tab > App Settings > Resources.
Click Add to create an external resource.
By default the following properties are enabled:
- Enabled – the resource is active.
- Global – the resource will be connected while loading application.
App Settings > General.