Storybook + Tailwind 2 + PostCSS 8

Tailwind 2 uses PostCSS 8 by default.

Storybook uses PostCSS 7 by default.

In order to get Storybook to work with Tailwind you have 2 options:

1. Use Tailwind's @tailwindcss/postcss7-compat package following the steps outlined here.
2. Use Storybook's @storybook/addon-postcss package following the steps outlined here.

This repo demonstrates option 2 with the new Tailwind JIT Compiler that got released on Monday 15th March. If you want to use the standard compiler, replace "@tailwindcss/jit" in postcss.config.js with "tailwindcss".

// Tailwind JIT Compiler Config
module.exports = {
  plugins: {
    "@tailwindcss/jit": {},
    "autoprefixer": {},
  },
}

// Standard Tailwind Config
module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}