Why not tagged template literals?

[timwis]

Forgive me if this is a silly question, but did you consider using tagged template literals? This would make the library ES6-compliant and not always require transpiling (even today in modern browsers).

It would end up looking pretty similar:

function setStyles (fontSize, margin) {
  return style`
    body {
      font-size: ${ fontSize }px;
      line-height: ${ fontSize * 1.2 }px;
      margin: ${ margin }px;
    }`
}

[tunnckoCore]

Review the https://github.com/babel/babel/pull/3376 thread and partially this one https://github.com/krasimir/absurd/issues/127 (parts of it will need to be translated to English).

In short: Not so easy, not so enough, not so best solution for @krasimir's ideas and use cases he trying to handle.

[krasimir]

@timwis not a silly question at all. @tunnckoCore was very kind pointing you to the places where I was going to link too. There are some disadvantages of using tagged template literals but I see that lots of people are asking about that so I may give it a try.

My biggest problem with this approach is that CSSX relies on parsing the code and analyzing it. I.e. we have an AST produced and from that AST we generate the JS which is later transformed to CSS. If we go with template literal we'll still need to involve the parsing process because we still need to produce valid JS equivalent of the styles. This will lead to an additional build step or bringing the whole parser in the browser (which is not a good idea). So, if we have an additional build step we'll probably go without a template strings.

[timwis]

Ah, I understand. Thanks for taking the time to respond.