web-dev-qa-db-fra.com

Comment faire pour habiller les balises dans le code VS?

Je voudrais envelopper mon code HTML sélectionné dans une balise en code VS. Comment je fais ça?

htmlvisual-studio-code
105
hannes neukermans

Une recherche rapide sur le marché du VSCode: https://marketplace.visualstudio.com/items/bradgashler.htmltagwrap .

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

  2. coller ext install htmltagwrap et entrer

  3. sélectionnez HTML

  4. presse Alt + W (Option + W pour Mac).

72
hannes neukermans

Embedded Emmet pourrait faire l'affaire:

  1. Sélectionner du texte (facultatif)
  2. Ouvrir la palette de commandes (généralement Ctrl+Shift+P)
  3. Exécuter Emmet: Wrap with Abbreviation
  4. Entrez une balise div (ou une abréviation .wrapper>p)
  5. Frappé Enter

La commande peut être assignée à un raccourci clavier.

enter image description here

Cette chose supporte même les arguments de passage:

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

Comme je ne peux pas commenter, je vais développer la réponse fantastique d'Alex.

Si vous voulez une expérience semblable à Sublime avec le wrapping, ouvrez les extensions Keymap (Préférences> Extensions Keymap [Cmd+KCmd+M]) et ajoutez l'objet suivant:

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

Ce qui liera la commande de bouclage Emmet à Alt+W quand le texte est sélectionné

(Désolé pour les instructions uniquement sur OSX)

26
Andrew Lewis
  1. Ouvrez les raccourcis clavier en tapant ⌘ Command+k⌘ Command+s ou Code > Preferences > Keyboard Shortcuts
  2. Tapez emmet wrap
  3. Cliquez sur le signe plus à gauche de "Emmet: Wrap with Abbreviation".
  4. Type ⌥ Option+w
  5. Presse Enter
8
Adam Gonzales