EnglishNederlandsFrançais Toggle theme

Eleventy Baseline

Start building your site, skip the recurring setup work.
Table of Contents

navigator

INTERNAL_KEY: '_navigator'

What it does

The navigator module is Baseline's debug surface. It exposes Eleventy's render context (the values Nunjucks has in scope when a template renders) and Baseline's runtime stores so you can inspect them from a template, without pausing the build or wiring a debugger. It registers two Nunjucks globals (_runtime, _ctx), three debug filters (_inspect, _json, _keys), a computed _snapshot of baseline's runtime state, and an optional virtual page (a synthetic template baseline injects into the build, not a file you write) that dumps everything onto a page at /navigator-core.html.

_runtime and _ctx dump the full render context and may include secrets from your data layer or environment. Only use them in local development or secured environments.

Active when

The module's globals, filters, and computed _snapshot register whenever the module is loaded. Loading is governed by the navigator option:

  • navigator: true (the default in dev, when ELEVENTY_ENV=development): module loads, virtual page enabled.
  • navigator: false (the default in production): module is not loaded.
  • navigator: { template, inspectorDepth }: module loads, virtual page enabled when template is truthy, inspector depth tuned by inspectorDepth.

Lifecycle

  • Build-time. Registers the Nunjucks globals, the debug filters, the computed _snapshot, and (when enabled) the virtual page at /navigator-core.html.
  • Cascade-time. _snapshot resolves on every page; its contentMap and pageContext fields are read from the runtime stores.

How it works

  1. Resolve options. The module reads options.navigator from state. Boolean shorthand activates the virtual page; object form unwraps to { template, inspectorDepth }.
  2. Register globals. _runtime and _ctx are added as Nunjucks globals.
  3. Register _snapshot. Added as eleventyComputed._snapshot. Resolves per page from the runtime stores.
  4. Register debug filters. _inspect, _json, _keys.
  5. Register the virtual page (when enabled). A bundled HTML template is read from disk and registered with permalink: '/navigator-core.html', excluded from collections.

Defaults

  • Virtual page. On in development (ELEVENTY_ENV=development), off otherwise.
  • Inspector depth. 4. Controls how deep _inspect renders nested objects on the virtual page.
  • Globals. Always registered when the module is loaded.

Options

Option Type Default Meaning
navigator boolean | { template?: boolean, inspectorDepth?: number } true in dev true activates the virtual page; false skips it. Object form lets you set template and inspectorDepth independently: { template: true, inspectorDepth: 6 }.

Globals

Two Nunjucks globals, available in any template once the module is loaded.

  • _runtime() returns { env, ctx, globals }:
    • env: the Nunjucks environment instance (filters, globals, configured engines).
    • ctx: the current render context (the values in scope at this point in the template, including page, eleventy, your data cascade).
    • globals: registered Nunjucks globals.
  • _ctx() returns the render context directly (the same ctx object as _runtime().ctx). A shortcut for the common case.

Both are functions, called with () in templates.

Computed _snapshot

Every page receives a computed _snapshot with two fields, read from Baseline's runtime stores:

  • contentMap: the inputPath ↔ url lookup Baseline builds during the cascade. Used by the head module for canonical resolution.
  • pageContext: the page-context registry's snapshot, keyed by URL. The same per-page context the head module reads at transform-time. See Page context.

_snapshot.contentMap is null on the navigator template itself, because the template renders before Eleventy's eleventy.contentMap event fires. Read _snapshot from any ordinary page to see a populated contentMap.


Debug filters

Three filters registered alongside the globals. Full reference on Filters.

  • _inspect(value, opts): pretty-prints any value with configurable depth.
  • _json(value): stringifies as JSON.
  • _keys(value): returns the top-level keys of an object.

The virtual page

When the virtual page is enabled, Baseline registers a synthetic template that lives at /navigator-core.html. The template iterates over _runtime() and renders each key with _inspect at the configured depth.

See the navigator template in action.

Note on the URL: the path still ends in -core.html. That is the historical filename of the bundled template. The user-facing module name is navigator; the URL path may be aligned in a future release.

You do not need the virtual page to use the module. The globals and the computed _snapshot work on any template you author.


Tips

  • Tune the depth for the virtual page with the object form: baseline(settings, { navigator: { template: true, inspectorDepth: 4 } }). The boolean shorthand keeps the default depth of 4.
  • Pair _ctx() with _inspect on any page for targeted debugging. You do not need the virtual page for that.
  • The virtual page renders a large snapshot. Keep it off in production. The default already does, but check your environment if it shows up unexpectedly.
  • _snapshot.contentMap being null is not a bug; it is the lifecycle (the navigator template renders before the content map is ready). Read _snapshot from any ordinary page to see it populated.

Example: inspect on any page

You can drop this in any layout or page to render a quick snapshot:

{% for key, value in _runtime() %}
	<details>
		<summary><strong>{{ key }}</strong></summary>
		{% if value | isString %}
			<pre>{{ value | safe }}</pre>
		{% else %}
			<pre>{{ value | _inspect({ depth: 2 }) }}</pre>
		{% endif %}
	</details>
{% endfor %}

Peer deps

None.

See also

Previous: multilang

Next: sitemap