Paste HTML as JSX
file. It has automagically been converted to JSX!
Sometimes the automatic JSX-conversion can be annoying, for example when working
on hybrid projects that use both JSX and HTML.
If you want to control the conversion by yourself, there is an
which can be activated by setting the
paste-html-as-jsx.mode setting to
on-demand mode is active, copied HTML will NOT be automatically
converted. A command is added to the palette that can convert your clipboard
contents from HTML to JSX at any point.
How It Works
Since the VSCode extension API does not offer an interception point to modify
clipboard content before pasting, this has to rely on changing the clipboard
text at potentially relevant times.
The extension kicks in when one of the following events happen:
- You focus the VSCode window and the current editor has a relevant language id
- You focus a different editor that has a relevant language id
The relevant language ids are:
The extension then checks if the clipboard is HTML by checking if the first
non-whitespace character is
< and the last is
> (I know, it is not very
accurates). If that is true, it convert your clipboard contents to JSX and
writes it back.
Problems or Suggestions
If you experience any issues or have ideas on how to improve the extension, feel
free to open an issue.
Paste HTML as JSX, a VSCode extension by
If you like this extension and would like to know about more cool stuff I do,
check out my Twitter @leodriesch!