How to keep comments on their own lines after formating

[blachawk]

I have a general question in regards to Beautify css/sass/scss/less by michelaemelluso for Visual Studio Code.

Within LESS files, when we format our documents by pressing ALT+SHIFT+F

How can we keep our comments on their own lines?

Right now if I have the following scenerio...

.demoa {
text-align:left;
}
//demob instructions for LESS note visibility only
.demob {
text-align: right
}

and then format, it ends up like this....

.demoa {
text-align:left;
}//demob instructions for LESS note visibility only
.demob {
text-align: right
}

I don't want the comment to bump up to previous lines. I want my LESS comment to be on it's own line.

Any tips on that?

[bitwiseman]

When I put the following into the website, the comment is maintained on it's own line:

<style>
	.demoa {
		text-align: left;
	}

	//demob instructions for LESS note visibility only
	.demob {
		text-align: right
	}
</style>

Internally, this uses the css beautifier on the text inside the style tags. I'm not sure what would be causing the behavior you described. Is that VS Code plugin using the latest version?

[pawelzwronek]

@bitwiseman you can see this behavior on http://jsbeautifier.org/

[blachawk]

@bardiharborow that's because you are not really in a style-sheet, you are using the style element on another page, perhaps an html page.

[bitwiseman]

@pawelzwronek
Strange. I tried it on the website and it didn't happen, and now it does. :| Adding to the milestone.

[ghost]

There is a pull request that should address this issue: #1291. It's waiting on a review.

[djmtype]

I just wanted to add, inside .scss files, regular css comments (/* comment */) are kept on their own line, but sass-flavored comments (// comment) are not.