Support Simpler Syntax

[arunoda]

Why don't we use the familiar syntax like this:

 <style jsx>
      p {
        color: red;
      }
 </style>

But this:

 <style jsx>{`
      p {
        color: red;
      }
 `}</style>

[bogas04]

Wouldn't JSX compiler freak out seeing {} inside a JSX tag ? And what if I want to use

p {
  color: {`theme().color`}
}

how will your change support that ?

I personally feel that using template string is the right way as it allows you to extract it to variable(s), which would likely be the case if you have more than 4-5 style rules. The above convenience doesn't serve much purpose and would require a lot of change to the babel plugin IMO.

[rauchg]

@bogas04 is right. I, too, wanted that to be possible, but we got pretty close!

[arunoda]

Yep. Makes sense.