storybook-tailwind-foundations

Storybook tailwind foundations from tailwind.config.js as stories
19,089 8
Install
npm install storybook-tailwind-foundations
Latest Version:1.1.2
Vue:3
License:MIT
Last Updated:Aug 31, 2022
Links: GitHub  ·  npm
Maintainer: renatomoor

Getting Started

Example

Requirements

  • Vue 3.0+
  • Tailwind CSS
  • Storybook

Install package

npm install storybook-tailwind-foundations

Adapt ./storybook/main.js

const path = require('path');
const tailwindConfigPath = path.join(__dirname, '../tailwind.config.js'); // or your own config file
require('storybook-tailwind-foundations/initialize.js')
  .default(tailwindConfigPath);

module.exports = {
   // ...
  stories: [
    // ... 
    '../node_modules/storybook-tailwind-foundations/**/*.stories.js'
  ],
}

Start Storybook

If you make any change to the tailwind config, you need to restart storybook to see the changes. Now you can start storybook and the Foundations section should appear in the sidebar.

Related Packages

vue-tailwind-modal

A modal window for Vue using Tailwind CSS.

8,532 28
vue-themed-style-loader

Webpack loader to handle themed style builds of Vue.js applications

4,605 17
css-render

Generating CSS using JS with considerable flexibility and extensibility, at both...

4,540,807 210
storybook-addon-vue-slots

Vue Slots support for Storybook

491,750 22

Version History

Version Released Vue License
1.1.2 ^3.2.25 MIT
1.1.0 ^3.2.25 MIT
1.0.0 ^3.2.25 MIT
0.2.1 ^3.2.25 MIT
0.2.0 ^3.2.25 MIT