In page frontmatter, an env var condition followed by an import leaves an unterminated string

[olets]

Astro Info

My real local example:

Astro                    v4.10.2
Node                     v20.14.0
System                   macOS (arm64)
Package Manager          bun
Output                   server
Adapter                  none
Integrations             none

Minimal reproduction:

Astro                    v4.10.2
Node                     v18.20.3
System                   Linux (x64)
Package Manager          unknown
Output                   static
Adapter                  none
Integrations             none

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

No response

Describe the Bug

In page frontmatter, an env var condition followed by an import leaves an unterminated string, which breaks the rest of the page.

Checking the participation box because I'm willing, but it doesn't feel like my wheelhouse.

What's the expected result?

Env var use in frontmatter is not more restricted than the use of other values.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/withastro-astro-nfmb4n?file=src%2Fpages%2Findex.astro

Participation

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

[Trombach]

Interesting 🤔 If you add a semicolon after the if statement it starts to work again if (import.meta.env.VITE_DEV) {};

[olets]

Hm that doesn't work for me.

Wonder if what you saw is this other unexpected behavior I noticed in the stackblitz but not in my app: if you fix the problem by for example commenting out the if line, and then reintroduce it for example by uncommenting it, the fix sticks — the app continues to build. That does not happen for me in my real app. If I comment out the import, start my app, and uncomment the import, the dev process breaks.

[bluwy]

Seems like a compiler issue, you can paste the frontmatter code in https://live-astro-compiler.vercel.app to observe the invalid output.

const $$stdin = $$createComponent(($$result, $$props, $$slots) => {

// good
// if (true) {}

// good
// console.log(import.meta.env.VITE_DEV)

// bad
if (import.meta.env.DEV) {}

/**
 * necessary for bug
 *
'     // <----- the problem


return $$render``;
}, '<stdin>', undefined);
export default $$stdin;

Editing the DEV keyword to DEVVVV or something long/short reveals it's some sort of slicing issue.

[Trombach]

@olets Actually, I think I had removed the comment. There was still an error, but a different one. I think the "fix" was only coincidental