https://github.com/green-labs/res_tailwindcss

ReScript PPX which validates the tailwindcss class names
https://github.com/green-labs/res_tailwindcss

ppx rescript tailwindcss

Last synced: about 2 hours ago
JSON representation

ReScript PPX which validates the tailwindcss class names

• Host: GitHub
• URL: https://github.com/green-labs/res_tailwindcss
• Owner: green-labs
• License: mit
• Created: 2021-12-27T16:42:17.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2024-10-21T13:13:48.000Z (22 days ago)
• Last Synced: 2024-10-31T09:37:10.979Z (12 days ago)
• Topics: ppx, rescript, tailwindcss
• Language: OCaml
• Homepage:
• Size: 171 KB
• Stars: 28
• Watchers: 8
• Forks: 5
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ReScript Tailwindcss

A ReScript PPX, which validates the tailwindcss class names

## Motivation

The [tailwind-ppx](https://github.com/dylanirlbeck/tailwind-ppx) is the only ppx to validate the tailwindcss class names in compile time. But, it was archived, and written by `ocaml-migrate-parsetree`. My team considered taking over the repository and maintaining it but decided to rewrite it from the scratch with `ppxlib` and `menhir`. Additionally, we improve the logic to find the invalid class name with [Spelling Corrector](https://norvig.com/spell-correct.html) algorithm.

Plus, the arbitrary values in the JIT mode of Tailwindcss are supported!

```html

 ... 

 ... 

 ... 

 ... 

 ... 

 ... 

 ... 

 ... 

svg]:rotate-180")> ... 

```


## Install

```

yarn add -D @greenlabs/res-tailwindcss

```

`` should be replaced with the relative location of your generated tailwindcss file from your project root in which the `bsconfig.json` file is located.

```

// bsconfig.json

"ppx-flags": [

  ...,

  ["@greenlabs/res-tailwindcss/ppx", "--path "]

],

```

## Example

```rescript

svg]:rotate-180")>

  ...

  



```


## Development

1. Create a sandbox with opam

```

opam switch create tailwindcss 4.14.0

```

2. Install dependencies

```

opam install . --deps-only --with-test

```

3. Build

```

opam exec -- dune build

```

4. Test

```

cd rescript

(install dependencies)

yarn

(build --watch)

yarn res:clean && yarn res:watch

(run test --watch)

yarn test:watch

```