Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>wrapperNew to Visual Studio Code? Get it now.
wrapper

wrapper

Havfar

|
66 installs
| (0) | Free
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Wrapper Extension

The Wrapper extension for Visual Studio Code provides commands to wrap selected text in various HTML elements such as div, span, container, row, column, and fragment. It also includes a command to remove wrappers.

Features

  • Wrap selected text with div, span, Row, column, or fragment.
  • Remove wrappers from selected text.
  • Keybindings for quick access to wrapping commands.

Usage

Convert with cursor

Wrapper Extension Usage Open a TypeScript React file in Visual Studio Code. Select the text you want to wrap. Use the command palette (Ctrl+Shift+P or Cmd+Shift+P on macOS) to search for the wrapping commands:

  • Wrap with div
  • Wrap with span
  • Wrap with Row
  • Wrap with Column
  • Wrap with Fragment
  • Remove wrapper

Highlight selection

You can also select the text you want to wrap by highlighting it with your mouse or keyboard. Once selected, use the command palette or the keybindings to wrap the selected text with the desired HTML element. Wrapper Extension Usage

Shortcuts

Alternatively, use the keybindings:

  • Alt+D (or Option+D on macOS) to wrap with div
  • Alt+S (or Option+S on macOS) to wrap with span
  • Alt+F (or Option+F on macOS) to wrap with fragment
  • Alt+R (or Option+R on macOS) to remove wrapper
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft