search

ben-rogerson / twin.macro

🦹‍♂️ Twin blends the magic of Tailwind with the flexibility of css-in-js (emotion, styled-components, solid-styled-components, stitches and goober) at build time.
MIT License
7.92k stars 183 forks source link

rc5 does not recognize md: prefix, using emotion #747

Closed FranciscoKloganB closed 1 year ago

FranciscoKloganB commented 1 year ago
  1. When using twin.macro@rc5 the code snippet below yields a "MacroError: Variant 44 md not found, did you mean md:?"
  2. Using emotion
<div tw="w-44 md:w-80 lg:w-64">
    <AppSearchBar screenReaderDescription="Search events">
        <SearchIcon tw="h-5 w-5 text-gray-400" aria-hidden="true" />
    </AppSearchBar>
</div>

If I pin to twin.macro@rc.4, the code starts executing properly again. For it to work on twin.macro@rc.5, I found out I had an invalid, hidden, character in the first line of the snippet above. After re-writing the same code to deal with that, the issue appears to have vanished. I am not quite sure if this is a twin issue or a babel one.

image

ben-rogerson commented 1 year ago

Hidden characters are part of some of the worst errors 😮‍💨

Yeah that error message isn't right here. Looks like the usual way of splitting up the string at the spaces failed. Right now I'm not quite sure what to check for to fix this error as the character is filtered from the code block above.

ben-rogerson commented 1 year ago

V3 is now out - let me know if you see this again 👍