Version

3.1.2

Reproduction link

https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8bWFpbj5cbiAgICA8cHJlIGNsYXNzPVwiY29kZVwiIC8+XG4gIDwvbWFpbj5cbjwvdGVtcGxhdGU+XG5cbjxzY3JpcHQgc2V0dXAgbGFuZz1cInRzXCI+XG48L3NjcmlwdD4ifQ==

Steps to reproduce

Look at the repro. I found the culprit, it seem to happen when you use self-closing tags (e.g. <pre> in my example).

What is expected?

Generates a single root element template (main)

What is actually happening?

Generates a Fragment with whitespace and new lines before and after the <main> element.

This doesn't seem to happen in non-setup mode.

Seems not to be related to script setup.

https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8bWFpbj5cbiAgICA8cHJlIGNsYXNzPVwiY29kZVwiIC8+XG4gIDwvbWFpbj5cbjwvdGVtcGxhdGU+XG5cbjxzY3JpcHQgbGFuZz1cInRzXCI+XG4gIGV4cG9ydCBkZWZhdWx0IHt9XG48L3NjcmlwdD4ifQ==

My bad! 🤣 I made that supposition based on other components in my app before I identified what the culprit was...

This bug has annoying consequences, because there are things you can't do on a fragment component, such as using directives.

Sure. But if you use a closing tag, it'd working for now, so we have a workaround until it's fixed 😊