Come eseguire il wrapping dei tag nel codice VS?

Vorrei racchiudere il mio html selezionato all'interno di un tag nel codice VS. Come lo faccio?

Emmet incorporato potrebbe fare il trucco:

1. Seleziona testo (opzionale)
2. Apri la tavolozza dei comandi (di solito Ctrl+ Shift+ P)
3. Eseguire Emmet: Wrap with Abbreviation
4. Inserisci un tag div(o un'abbreviazione .wrapper>p)
5. Colpire Enter

Il comando può essere assegnato a un keybinding.

Questa cosa supporta anche passare argomenti:

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

Usalo in questo modo:

• span.myCssClass
• span#myCssId
• b
• b.myCssClass

Una rapida ricerca sul mercato VSCode: https://marketplace.visualstudio.com/items/bradgashler.htmltagwrap .

1. Avvia VS Code Quick Open ( Ctrl+ P)

2. incolla ext install htmltagwraped entra

3. seleziona HTML

4. premi Alt+ W( Option+ Wper Mac).

Dato che non posso commentare, espanderò la fantastica risposta di Alex.

Se desideri un'esperienza simile a quella sublime con il wrapping, apri le estensioni keymap (Preferenze> Estensioni keymap [ Cmd+ K Cmd+ M]) e aggiungi il seguente oggetto:

{
    "key": "alt+w",
    "command": "editor.emmet.action.wrapIndividualLinesWithAbbreviation",
    "when": "editorHasSelection && editorTextFocus"
}

Il che vincolerà il comando A capo di Emmet a Alt+ Wquando viene selezionato il testo

(Mi dispiace solo per le istruzioni OSX)

1. Apri le scorciatoie da tastiera digitando ⌘ Command+ k ⌘ Command+ soCode > Preferences > Keyboard Shortcuts
2. genere emmet wrap
3. Fai clic sul segno più a sinistra di "Emmet: Wrap with Abbreviation"
4. Digita ⌥ Option+w
5. stampa Enter

imo c'è una risposta migliore per questo usando Snippet

Crea uno snippet con una definizione come questa:

"name_of_your_snippet": {
    "scope": "javascript,html",
    "prefix": "name_of_your_snippet",
    "body": "<${0:b}>$TM_SELECTED_TEXT</${0:b}>"
}

Quindi associarlo a una chiave in keybindings.json Ad esempio in questo modo:

{ 
    "key": "alt+w",
    "command": "editor.action.insertSnippet",
    "args": { "name": "name_of_your_snippet" }
}

Penso che questo dovrebbe darti esattamente lo stesso risultato di htmltagwrap ma senza dover installare un'estensione.

Inserirà tag attorno al testo selezionato, per impostazione predefinita <b>tag e selezionerà il tag in modo che la digitazione ti permetta di cambiarlo.

Se desideri utilizzare un tag predefinito diverso, modifica semplicemente bla bodyproprietà dello snippet.