Subscribe on changes!

`class and style merging` conflict with vue.template.compilerOptions.whitespace preserve

avatar
Sep 25th 2023

Vue version

3.3.4

Link to minimal reproduction

https://stackblitz.com/edit/github-gjgfy8

Steps to reproduce

Vite 4.4.9 set option compilerOptions.whitespace = "preserve"

What is expected?

option compilerOptions.whitespace and style and merging work correctly

What is actually happening?

if we leave a comment before the first element in the template style and class merging do not work

System Info

No response

Any additional comments?

No response

avatar
Sep 25th 2023

I did not get your point or see anything related to whitespace. Do you mean the class-from-parent does not fall through to the HasComment.vue component? image if so, this is the expected behavior. here is a warning: image

avatar
Sep 25th 2023

@edison1105

if so, this is the expected behavior. here is a warning:

if I remove config whitespace: 'preserve', it will be able to inherit normally even if the first element in template is a comment this is why I think is the conflict between them

avatar
Sep 25th 2023

the root cause is: \n will render as an empty text node if preserving whitespace, that lead attrs does not fall through. I feel this is expected behavior for now, because if replace the comment with a text node, the attrs also do not fall through. see. but this is room to improve this. eg: ignore text nodes when falling through attrs.

@memsenpai there seems no workaround except adding a root tag or removing whitespace: 'preserve'.

avatar
Sep 25th 2023

@edison1105 thank you for reply

it still works fine in vue 2, where \n will be converted to whitespace, and despite the comment at the top, style and class extend still works fine.

Are you sure this is expected behavior and not a bug?

avatar
Sep 25th 2023

@memsenpai Actually, I am not sure if it is a bug. let's wait for others' input.