Skip to content

Nested template literals in frontmatter throw "Unexpected token" (Astro 7 / new compiler) #138

Description

@jettwayio

Astro Info

Astro                    v7.1.3
Node                     v26.5.0
System                   macOS (arm64)
Package Manager          pnpm
Output                   static
Adapter                  none
Integrations             none

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

A template literal containing another template literal nested inside a ${} expression fails to compile in the frontmatter, throwing [CompilerError] Unexpected token. This is valid JS/TS and worked in Astro 6 and earlier.

Reproduction

---
let hideTitle = false;
let title = "Hello";
let srcdoc = `<div>${hideTitle ? '' : `<span>${title}</span>`}</div>`;
---
<div>{srcdoc}</div>

Running astro build fails with:

[CompilerError] Unexpected token

pointing at the frontmatter block.

Expected behavior

Nested template literals should parse normally, as they do in standard JS/TS and in Astro 6.

Workaround

Pulling the inner template literal out into its own variable avoids the issue:

---
let inner = hideTitle ? '' : `<span>${title}</span>`;
let srcdoc = `<div>${inner}</div>`;
---

Additional context

This appears to be a limitation in the new compiler-rs frontmatter compiler introduced as part of the Rolldown/Vite 8 migration, it doesn't seem to track backtick nesting depth correctly inside ${} expressions.

What's the expected result?

Nested template literals should parse normally, as they do in standard JS/TS and in Astro 6.

Link to Minimal Reproducible Example

NA

Participation

  • I am willing to submit a pull request for this issue.

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs triagetriage: failedTriage failed unexpectedly; can be retried up to 3 failed attempts

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions