htmlvisual-studio-code

How can I do tag wrapping in Visual Studio Code?


I would like to wrap my selected HTML content within a tag in Visual Studio Code. How do I do that?


Solution

  • Embedded Emmet could do the trick:

    1. Select text (optional)
    2. Open command palette (usually Ctrl+Shift+P)
    3. Execute Emmet: Wrap with Abbreviation
    4. Enter a tag div (or an abbreviation .wrapper>p)
    5. Hit Enter

    Command can be assigned to a keybinding.

    enter image description here


    This thing even supports passing arguments:

    {
        "key": "ctrl+shift+9",
        "command": "editor.emmet.action.wrapWithAbbreviation",
        "when": "editorHasSelection",
        "args": {
            "abbreviation": "span",
        },
    },
    

    Use it like this: