Builder Dependency Declaration JSON Files
Overview
Fluid Infusion's custom build system uses JSON files to declare dependencies. These files exist in the source hierarchy, typically one per "module." A module might consist of a component, a part of the framework or a collection of third-party files. They are used by the Builder to determine exactly which files need to be included in a custom build.
Important
Developers who add or remove files from a module, or alter the dependencies of a module, must remember to update the dependency file. If they are introducing new dependencies into Infusion, they should create a new dependency declaration file.
File Location and Name
Builder dependencies should be placed in the root folder of a module, that is, the folder that is the top-level ancestor for any files used by the module.
The file name should be a concatenation of the module name and "Dependencies.json
". For example:
jQueryDependencies.json
rendererDepenencies.json
inlineEditDependencies.json
Format
A dependency declaration object consists of one property, the modules's name. This property may contain five properties, as shown below:
{ "<moduleName>": { "name": "<display version of module name>", "description": "<text description of module, for display>", "cssFiles": <list of CSS files required by module>, "files": <list of JavaScript files required by module>, "dependencies": <list of other modules required by this module> } }
name
This is a string containing the name of the module. This string will be displayed in the Builder user interface, and so should be formatted as such: capitalized, with regular spacing.
description
This is a string containing a short description of the module. It will be displayed in the Builder user interface to inform users about just what the module is.
cssFiles
This a list of strings containing the names of the CSS files used by this module. It should either be
- a single string if only one CSS file is used, or
- an array of strings if more than one file is used.
files
This a list of strings containing the names of the JavaScript files used by this module. It should either be
- a single string if only one JavaScript file is used, or
- an array of strings if more than one file is used.
dependencies
This a list of strings containing the names of other modules used by this module. The names should be those specified as the key for that module (i.e. the moduleName
, not the display name. As with the CSS files and the JavaScript files, this entry should be
- a single string if there is only one dependency, or
- an array of strings if more than one module is used.
Example
The following code snippet shows the contents of a sample dependency file:
{ "inlineEdit": { "name": "Inline Edit", "description": "Edit text without changing context.", "cssFiles": "InlineEdit.css", "files": [ "InlineEdit.js", "InlineEditIntegrations.js" ], "dependencies": [ "jQuery", "jQueryUICore", "jQueryTooltipPlugin", "framework", "undo", "tooltip" ] } }
This example shows
- the difference between the "module name,"
inlineEdit
, and the displayname
, "Inline Edit" - how to specify a single file as a single string (shown in the
cssFiles
field) - how to specify multiple files as an array of strings (shown in the
files
field)
Note also:
- The
dependencies
contain the 'camel-case' module names of other modules, not the display names. - The file contains JSON, not JavaScript, and so all fields must be enclosed in quotation marks. (You may wish to validate your JSON using JSONLint.