Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Automatic Template String Converter JS (React Support)New to Visual Studio Code? Get it now.
Automatic Template String Converter JS (React Support)

Automatic Template String Converter JS (React Support)

João Paulo Grimaldi

|
1 install
| (0) | Free
Auto template string converter
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Auto Template String

Automatically converts quoted strings to template literals when you start typing an interpolation.

Features

  • Converts the surrounding quotes to backticks when you type { immediately after ${ inside a single- or double-quoted string.
  • Preserves your normal typing by forwarding input to VS Code's default handler first.
  • Works in JavaScript, TypeScript, JSX, and TSX files.
  • Zero configuration.

Example flow (on a single line):

  1. You have: "Hello, ${|}" (caret at | inside a quoted string)
  2. You press {
  3. The extension replaces the surrounding quotes with backticks → `Hello, ${|}`

How It Works

  • The extension hooks the type command for supported languages and always lets the default typing happen first.
  • When the typed character is {, it checks the text to the left of the caret on the current line. If it ends with ${, it:
    • Finds the most recent ' or " on that line to the left of the caret.
    • Finds the matching closing quote on the same line.
    • Replaces both quotes with backticks, turning the string into a template literal.

Release Notes

0.0.1

  • Initial release: automatic quote-to-backtick conversion on ${ within a line.

Author

  • Matheus Mallet

Enjoy! If this saves you keystrokes, a star is appreciated.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft