web-dev-qa-db-ja.com

VSコードでタグをラッピングする方法

選択したHTMLをVSコードのタグ内にラップします。それ、どうやったら出来るの？

htmlvisual-studio-code
92
hannes neukermans

VSCode市場のクイック検索： https://marketplace.visualstudio.com/items/bradgashler.htmltagwrap 。

  1. VS Codeクイックオープンを起動（Ctrl+P）

  2. ext install htmltagwrapを貼り付けて、

  3. hTMLを選択

  4. 押す Alt + W （Option + W Mac用）。

64
hannes neukermans

埋め込まれた Emmet がトリックをやることができます：

  1. テキストを選択（オプション）
  2. コマンドパレットを開く（通常 Ctrl+Shift+P）
  3. Emmet: Wrap with Abbreviationを実行する
  4. タグdiv（または省略形.wrapper>p）を入力してください
  5. ヒット Enter

コマンドをキーバインドに割り当てることができます。

enter image description here

これは引数の受け渡しもサポートします。

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

私はコメントできないので、私はAlexの素晴らしい答えを詳しく説明します。

Sublime風のラッピング体験をしたい場合は、Keymap Extensionsを開いてください（Preferences> Keymap Extensions [Cmd+KCmd+M次のオブジェクトを追加します。

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

Emmetのwrapコマンドを Alt+W テキストが選択されているとき

（OSXのみの指示で申し訳ありません）

23
Andrew Lewis
  1. 入力してキーボードショートカットを開く ⌘ Command+k⌘ Command+s またはCode > Preferences > Keyboard Shortcuts
  2. emmet wrapと入力
  3. 「Emmet：略語で折り返す」の左側にあるプラス記号をクリックします。
  4. タイプ ⌥ Option+w
  5. 押す Enter
5
Adam Gonzales