tailwindcss-flexflow

tailwindcss-flexflow

A tailwindcss-flexflow that branches and bundles CSS by component groups or feature namespaces, helping you ship smaller, faster, and more maintainable style bundles.

✨ Features

• 📂 Component-based CSS splitting
• ⚡ Performance optimized
• 🔄 Improved caching
• 🧹 Dead style reduction
• 🔧 Flexible config (PostCSS, Sass, dynamic imports)

📦 Installation

npm install tailwindcss-flexflow --save-dev

or with Yarn:

yarn add tailwindcss-flexflow --dev

⚙️ Usage

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          'style-loader',
          'css-loader',
          {
            loader: 'tailwindcss-flexflow',
            options: {
              branchBy: 'folder',   // 'folder' | 'component' | 'regex'
              exclude: /legacy/,    // optional
              debug: false          // print debug info
            },
          },
        ],
      },
    ],
  },
};

💡 Example

See examples for sample setups.

🛣️ Roadmap

See ROADMAP.md.

📜 License

MIT – see LICENSE.md.