Keep Spaces/Comments/Layout

[jogibear9988]

We now use csstree in our web component designer (https://node-projects.github.io/web-component-designer-demo/index.html). It works very well (for the first draft), but now we have the problem that all the formating of the css is lost.

Is there a way to keep all the spaces/linebreakes and comments?

[bartveneman]

Seems like a duplicate of #78 perhaps?

[scripthunter7]

Yes, duplicate. I also opened a similar issue, it was also a duplicate: #212

It would be nice to come up with some kind of algorithm / data structure for this, since keeping the formatting would be useful in many cases.

[bartveneman]

I posted a workaround in that one: #78 (comment)

[scripthunter7]

I saw it, it's an interesting approach :) I also tried to solve it based on the locations. I use this library for parsing the selectors of filter rules in adblock filter lists, so line breaks are irrelevant to me (since an adblock rule is fixedly 1 line), only the spaces matter, and that could be calculated from the two also from the distance between nodes (although this approach does not handle the space-tab difference).

The disadvantage of our approaches is that they use "side effects" and do not consistently store the information in the nodes / AST (like PostCSS, for example). But the problem with PostCSS is that the core parses very few things, e.g. selectors and atrules are simply left as raw.

In my opinion, this does not even mean a breaking change in CSSTree, since the raws field is only additional information, the current AST remains compatible. I think you should somehow proceed "from the outside in" with the storage of the raw data in order to ensure that the result is consistent.

[jogibear9988]

I now switched to https://github.com/adobe/css-tools in my designer. It also looses some whitespace & formating, but at least it keeps the comments