How can I remove newlines and interstitial whitespace from a selection of markup in VSCode?

Viewed 14

If I have a bit of HTML, XML, or JSX formatted like this:

    <p class="foo">
        <b class="bar">
            some text
        </b>
    <p>

I would like to be able to make a selection from <p> to </p>, run a command (ideally via an assigned keyboard shortcut), and have VSCode convert it to this:

    <p class="foo"><b class="bar">some text</b><p>

As context, I sometimes need to process a fair amount of marked up text in a variety of file formats, and it's very tedious to manually do this kind of formatting (or unformatting). I know you can do it with a regex find and replace in selection, but that's inconvenient because (1) there doesn't seem to be an easy way to save a set of find/replace settings as a macro and then assign them to a keyboard shortcut, and (2) VSCode's handling of the "in selection" part of find/replace all confuses me every time I use it.

I used to do this in my previous editors (e.g. BBEdit, TextMate, Sublime), but I'm hitting a wall with VSCode. The best I can find is minify/uglify extensions that work on entire files. And tons of basic tips about toggling word wrap, automatically removing trailing whitespace, etc.

0 Answers
Related