Tailwind and Storybook… FINALLY!

What if testing components for accessibility violations were as simple as linting them for syntax errors. Would you give it a shot? Learn with ‪@chantastic‬!

▬ Chapters ▬▬▬▬▬▬▬▬▬▬

00:00:00 Tailwind and Storybook trouble?
00:00:24 Connect Tailwind and Storybook with Concurrently
00:00:45 Install tailwindcss
00:00:59 Import tailwind.css in preview.js
00:01:53 Use concurrently to run storybook and tailwind CLIs concurrently
00:02:59 Don't forget to update your build script!
00:03:10 Another option: postcss-addon
00:03:24 Next steps…

▬ Links and resources ▬▬▬▬▬▬▬▬▬▬

Tailwind CSS docs: https://tailwindcss.com/docs/installa...
Concurrently (npm): https://www.npmjs.com/package/concurr...
Storybook postcss addon: https://storybook.js.org/addons/@stor...
Twitter discussion with a number of alternate setups: https://twitter.com/chantastic/status...

Follow ‪@chantastic‬ on:
twitter:   / chantastic  
youtube: ‪@chantastic‬

▬ Follow us! ▬▬▬▬▬▬▬▬▬▬

Discord:   / discord  
Twitter:   / storybookjs  
GitHub: https://github.com/storybookjs/storybook

Chantastic’s Twitter:   / chantastic  

▬ Learn more ▬▬▬▬▬▬▬▬▬▬

Storybook at https://learnstorybook.com/
Storybook addons at https://storybook.js.org/addons
Component driven UI development at https://www.componentdriven.org/

▬ Free Storybook hosting ▬▬▬▬▬▬▬▬▬▬

Chromatic is made by Storybook maintainers and sets up in just 2 minutes.

Claim free Storybook hosting at https://www.chromatic.com/!