Variable checking runs on save (or on demand) and surfaces a JHE0001 diagnostic for any name your template references but never defines. The analyzer follows {% set %} assignments and loop variables, so you only see real misses — not false alarms on locals.

Names that come from your backend can be added to a workspace allowlist with one click via the Save variable quick fix.

Jinja2 Enhance parses your backend source to learn which variables each template actually receives. Flask render_template(), Django render(), FastAPI TemplateResponse, Express/Nunjucks res.render(), and standalone Jinja2 are all recognized.

Variables passed from the backend are no longer flagged as undefined, and the Variable Panel shows their origin alongside template-local bindings.

Hover a variable, click the link (or hit F12), and Jump the exact render_template / render / TemplateResponse call site that supplies it. Works across files, across frameworks, and across multi-render templates that receive different variables from different routes.

Builds a workspace-level template graph and walks the entire {% extends %} chain for each file. Variables defined in a base template are visible in every child; loop and block scopes are tracked correctly.

Two graph diagnostics catch structural problems early:

• JHE1101 — unresolved template path in extends/include/import
• JHE1102 — circular extends chain

Preview your Jinja2 template directly inside VS Code. The Template Preview panel renders your template and shows:

• The full rendered HTML output built from your template + variables
• Visual placeholders highlighting undefined or missing variables directly in the preview
• An error list with every misconfigured variable, each linking back to the exact line in your template

What’s included

No more guessing whether {{ user.name }} will actually resolve — see it rendered, or see exactly why it won’t.

Real Backend Context

The preview automatically detects the variables your backend passes to render_template(), render(), TemplateResponse(), or .render() — so the preview matches what you’ll actually see at runtime. Profile-defined values override these defaults.

CSS-Aware Preview

The preview panel automatically detects and applies the CSS your templates reference — no manual setup needed:

• Flask static files — url_for('static', filename='css/...') and /static/css/... paths are resolved relative to your project and loaded directly in the preview
• CDN stylesheets — Bootstrap, Tailwind CDN, Bulma, and any https:// stylesheet are injected automatically
• Inline <style> blocks — styles defined in the template or any of its {% extends %} ancestors are applied
• Fallback structural styles — when no CSS is detected, the preview applies a minimal stylesheet that makes semantic elements (<header>, <section>, <nav>, <aside>, <article>, <footer>) visually distinct so you can read the structure at a glance