Understanding Manifest Structure
Authors:
Cameron Johns, Cille Schliebitz, Anita Gu
Changed on:
3 Feb 2025
Overview
This lesson details the structure of Manifest documents, covering both main web application manifests and fragment manifests. We'll explore the required fields and optional configurations for the main manifest, including context, routes (section, page, and reference), and plugin integration. We'll also examine the simpler structure of fragment manifests and how they contribute to managing complex UI configurations.
Key points
- Manifest Types: There are two types of Manifests: main and fragment.
- Main Manifest Structure: Required fields include manifestVersion, name, title, context, and routes. Optional fields include homePath.
- Context Configuration: Defines whether the app operates at a LOCATION or RETAILER level and allows role-based access control.
- Routes (Section, Page, Reference): Routes define the navigation menu. Section routes group menu items, Page routes link to specific pages, and Reference routes include fragment manifests.
- Fragment Manifests: Fragment manifests contain only manifestVersion and routes, allowing for modular management of large Manifest configurations.
- Plugin Integration: The Manifest can include references to custom component plugins hosted externally.
Top Level Manifest Structure
There are two types of manifest document formats. The primary type is the main web application manifest, and the second type is a fragment that can be referenced from the main Manifest document.
The main manifest document structure is as follows:
1{
2 "manifestVersion": "2.0",
3 "name": "store",
4 "title": "Fluent Store",
5 "context": {
6 "level": "location"
7 },
8 "routes": MystiqueRoute[]
9 }
Language: plain_text
Name: Main manifest document structure
Description:
[Warning: empty required content area]The required fields include:
- manifestVersion
- name
- title
- context
- routes
Additionally, a main manifest can also set the homePath, which is the default path to load on login.
The Context configuration defines whether the app operates at a LOCATION or a RETAILER level. You can also declare that a user should have a specific role assigned in that context to be allowed access to the App.
Routes drive the Navigation menu drawer. The simplest type of Route is a Section route, which defines the navigation group header. For example, you may want to group a number of top-level menu items under a section called "Admin," "Customer Service," or "Inventory Management."

The primary Route type is a page route. This defines a specific page to display when the user clicks on the navigation item.

Finally, there are Reference routes, which provide manifest fragmentation capability, so that you do not need to manage the whole UI configuration in a single (and very large) JSON document.
`{`
` "type": "reference",`
` "settingName": "fc.mystique.manifest.servicepoint.fragment.pickandpack"`
`}`
The structure of a fragment Manifest is as follows:
`{`
` "manifestVersion": "2.0",`
` "routes": MystiqueRoutes[]`
`}`
Finally, the Manifest document can also be configured to read custom plugins containing custom components referenced within the Manifest.
`"plugins": [{`
` "name": "Example",`
` "src": "https://example.com/bundle.js"`
`}]`
The Configuration Guide provides more information and instructions on configuring each part of the Manifest document.