search

dylanirlbeck / tailwind-ppx

A Reason/OCaml Pre-Processor eXtension (PPX) that validates your Tailwind classes at compile-time.
MIT License
152 stars 15 forks source link

ReScript Support #138

Open CarlOlson opened 3 years ago

CarlOlson commented 3 years ago

It looks like other ReScript PPX projects (like graphql-ppx and styled-ppx) allow backticks.

  Warning number 108
  src/Options.res:2:37-42

  1 │ @react.component
  2 │ let make = () => <div className=%tw(`flex`) />

  Uninterpreted delimiters js

bsb: [3/3] src/Options.cmj
FAILED: src/Options.cmj

  We've found a bug for you!
  src/Options.res:2:33-35

  1 │ @react.component
  2 │ let make = () => <div className=%tw(`flex`) />

  Uninterpreted extension 'tw'.

It would also require updating the extractor for purgecss.

Otherwise tailwind-ppx works fine inside ReScript. :+1:

EDIT:

I forgot about the parens, so even without backticks the extractor needs to be updated for ReScript:

@react.component
let make = () => <div className=%tw("flex") />
gaku-sei commented 3 years ago

Sorry just my 2 cents, it seems the extractor works with ReScript already (https://github.com/dylanirlbeck/tailwind-ppx/blob/master/js/index.js) (v0.8.4), at least I could make it work on a pretty lage codebase recently 😕

dylanirlbeck commented 3 years ago

Got it. The issue seems pretty straightforward. I think it'd just involve a change in the AST matcher, but I'm wondering if there's a way to make it backwards-compatible with people who aren't using ReScript.

Regarding the extractor, there was a PR merged in a while back that adds ReScript support. Let me know if this isn't working for you though.

This may be an unnecessary worry, but I haven't kept up-to-date with the ReScript community while trying to finish up at uni. If someone has a quick fix, please don't hesitate to open a PR.