Manifest App

The Manifest App component loads and renders external micro-frontend bundles at runtime. It reads an include-manifest.json file—either from a remote URL or from the local wwwroot/htmlapps/{bundleName}/ directory—and injects each declared include block as raw HTML into the page. This enables teams to build, deploy, and version standalone HTML/JS/CSS applications independently of the Sitecore rendering host.

The manifest file follows a simple contract: an array of include objects (or an object with version and includes properties). Each include has a Name and Content field. The Content supports a {{rootPath}} placeholder that is automatically replaced with the resolved base path of the bundle at render time.

A custom Content Resolver (ManifestAppContentResolver) runs on the platform side to resolve Sitecore token replacements in the BundleName field—including the {{environment}} token which is replaced with the localenv:define AppSetting value—before the data reaches the rendering host.

Usage Notes

  • The BundleName field accepts either a relative folder name (resolved under wwwroot/htmlapps/) or a full URL (starting with http: or https:). When a URL is provided, the manifest is fetched via HTTP at render time.
  • The {{environment}} token in BundleName is replaced on the platform side by the ManifestAppContentResolver using the localenv:define AppSetting value. This enables environment-specific bundle URLs without changing datasource content.
  • The {{rootPath}} placeholder inside manifest include Content blocks is replaced with the resolved base path of the bundle at render time. This allows relative asset references within the injected HTML.
  • The OptionalParameters field uses a Name Value List field type. While the rendering view reads and parses these parameters, the current implementation does not apply them via template substitution (the Mustache/Handlebars integration is commented out). They are available for future use.
  • The manifest format supports two shapes: a plain JSON array of include objects, or an object with version and includes properties. Only version 1.0 (or empty) is currently supported.
  • Each include object in the manifest must have a Name (used as a section identifier) and a Content (the raw HTML to inject).
  • The component wraps all output in a <div> with standard column CSS classes. In Experience Editor mode, it displays a table showing the BundleName and OptionalParams values for easy identification.
  • Datasource location supports both local ./Page Components and shared content via the ancestor-or-self query to the Site’s Shared Content folder.

Control Properties

Standard Values / Defaults

PropertyDefault ValueNotes
Rendering Contents ResolverManifest App Content ResolverCustom resolver that performs {{environment}} token replacement on BundleName before sending to the rendering host.
Datasource Location./Page Components & Shared Content querySupports both local page-level and shared site-level datasources.
Parameters TemplateColumnInherits standard column parameters (Small, Medium, Large, Offset, Padding, AddClass).

Rendering Parameters

ParameterTypeDescription
SmallDroplinkBootstrap column width at the small breakpoint.
MediumDroplinkBootstrap column width at the medium breakpoint.
LargeDroplinkBootstrap column width at the large breakpoint.
OffsetSmallDroplinkColumn offset at the small breakpoint.
OffsetMediumDroplinkColumn offset at the medium breakpoint.
OffsetLargeDroplinkColumn offset at the large breakpoint.
PaddingTopDroplinkTop padding class.
PaddingBottomDroplinkBottom padding class.
PaddingStartDroplinkStart (left) padding class.
PaddingEndDroplinkEnd (right) padding class.
AddClassSingle-Line TextAdditional CSS classes to add to the component wrapper.

Template Properties

Datasource template: /sitecore/templates/Feature/MklComponents/ManifestApp

FieldTypeDescription
BundleNameSingle-Line TextThe bundle identifier or full URL. When set to a relative name (e.g. quick-quote), the rendering looks for wwwroot/htmlapps/{bundleName}/include-manifest.json. When set to a URL (e.g. https://cdn.example.com/apps/myapp/include-manifest.json), the manifest is fetched via HTTP. Supports the {{environment}} token which is resolved by the content resolver on the platform side.
OptionalParametersName Value ListKey-value pairs that are parsed and made available to the rendering view. Intended for future template variable substitution within manifest Content blocks (currently the Mustache/Handlebars integration is commented out). Parameters are URL-decoded before use.

Manifest File Contract

The include-manifest.json file should follow one of these shapes:

FormatStructure
Array[{"Name":"head","Content":"<link ...>"},{"Name":"body","Content":"<div ...>"}]
Object (v1.0){"version":"1.0","includes":[{"Name":"head","Content":"..."},{"Name":"body","Content":"..."}]}

Template properties

Control properties