tailw v0.2.0

Tailw - Generate Tailwind components

Ever wanted to create a Button using Tailwind? For me, it always ends up looking like this:

export function Button({ className, children, ...props }) {
  return (<button 
    className={`bg-blue-500 px-4 py-2 ${className}`} {...props}>  {children}
  </button>);
}

Sucks, right?

Also, imagine repeating this for Links, Headings, Text, ... You get the idea.

Using tailw, you have next to no boilerplate:

import tailw from "tailw";

const Button = tailw.button`bg-blue-500 px-4 py-2`;

Features

Installation

yarn add tailw

and you are ready!

VSCode Intellisense

To support Intellisense, open settings.json (for example, by typing F1 > Open Settings (JSON)), then add the following:

{
  "tailwindCSS.experimental.classRegex": [
    "tailw\\..*`(.*)`"
  ]
}