{"id":22255,"library":"rollup-plugin-tailwindcss","title":"rollup-plugin-tailwindcss","description":"Rollup plugin that bundles a Tailwind CSS stylesheet as a Rollup asset, supporting tree-shaking via purge options. Current version 1.0.0, last updated in 2020. Low release cadence. Key differentiator: minimal configuration for integrating Tailwind CSS with Rollup-based builds, unlike full Webpack setups.","status":"deprecated","version":"1.0.0","language":"javascript","source_language":"en","source_url":"https://github.com/alexdilley/rollup-plugin-tailwindcss","tags":["javascript","rollup-plugin","tailwind","tailwindcss"],"install":[{"cmd":"npm install rollup-plugin-tailwindcss","lang":"bash","label":"npm"},{"cmd":"yarn add rollup-plugin-tailwindcss","lang":"bash","label":"yarn"},{"cmd":"pnpm add rollup-plugin-tailwindcss","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dep: >=1.19.0","package":"rollup","optional":false},{"reason":"peer dep: ^1.0.0","package":"tailwindcss","optional":false}],"imports":[{"note":"ESM-only; no CommonJS exports","wrong":"const tailwind = require('rollup-plugin-tailwindcss')","symbol":"default","correct":"import tailwind from 'rollup-plugin-tailwindcss'"},{"note":"Named export is not available, only default export works","wrong":"import tailwind from 'rollup-plugin-tailwindcss'","symbol":"tailwind","correct":"import { tailwind } from 'rollup-plugin-tailwindcss'"},{"note":"TypeScript type; only available in v1.0.0+ (no types in earlier versions)","wrong":"","symbol":"PluginOptions","correct":"import type { PluginOptions } from 'rollup-plugin-tailwindcss'"}],"quickstart":{"code":"// rollup.config.js\nimport tailwind from 'rollup-plugin-tailwindcss';\n\nexport default {\n  input: 'src/index.js',\n  output: { dir: 'dist', format: 'esm' },\n  plugins: [\n    tailwind({\n      input: 'src/tailwind.css',\n      purge: {\n        enabled: true,\n        content: ['./src/**/*.js'],\n        options: { defaultExtractor: (content) => content.match(/[\\w-/:]+(?<!:)/g) || [] }\n      }\n    })\n  ]\n};","lang":"javascript","description":"Minimal Rollup config using the plugin with purge. Replace 'src/tailwind.css' and content paths as needed."},"warnings":[{"fix":"Switch to '@tailwindcss/rollup-plugin' or use PostCSS with rollup-plugin-postcss","message":"This plugin has not been updated for Tailwind CSS v2+ and is no longer maintained.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Use Tailwind CSS v1 or migrate to v2 and use tailwindcss/rollup-plugin","message":"Purge configuration is incompatible with Tailwind CSS v2.0.0's built-in purge","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Use separate plugin instances for each entry or combine stylesheets beforehand","message":"The plugin only handles a single CSS entry; multiple entry points are not supported","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"npm install tailwindcss --save-dev","cause":"tailwindcss not installed as peer dependency","error":"Error: Cannot find module 'tailwindcss'"},{"fix":"Use import syntax in .mjs file or configure Rollup to handle ESM","cause":"ESM import used in CommonJS environment","error":"SyntaxError: Unexpected token 'export'"},{"fix":"Add input: 'path/to/your.css' to the plugin options","cause":"Missing 'input' option in plugin config","error":"Error: No input file specified. Use the 'input' option."},{"fix":"Use import tailwind from 'rollup-plugin-tailwindcss' (not { tailwind })","cause":"Incorrect named import instead of default","error":"TypeError: Cannot destructure property 'tailwind' of ... undefined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}