VS Code - How To Automatically Convert Inline Style Strings To React Inline Style Objects

Viewed 828

Basically, I want to paste any web page's HTML into VS Code, push a button, and viola it converts stuff like this...

<div id="txt_2" style="position:absolute;left:1px;top:0px;width:958px;height:56px;overflow:hidden;"></div>

into this...

<div 
    id="txt_2" 
    style={{
        position: "absolute", 
        left: "1px", 
        top: "0px", 
        width: "958px", 
        height: "56px", 
        overflow: "hidden"
    }}></div>

...with just a push of a button, just like this website can do: https://casbin.org/CssToAndFromReact/

While that website is great, I still must copy/paste, copy/paste back and forth. If a page has hundreds of style strings, you can see how that can eat up time.

I looked but saw no posts specifically addressing this on Stack.

2 Answers
Related