esbuild-plugin-tailwindcss

Just a module to simplify the connection of TailwindCSS

Install

yarn add -D esbuild-plugin-tailwindcss

npm i -D esbuild-plugin-tailwindcss

Usage

Add plugin in build config:

import { tailwindPlugin } from 'esbuild-plugin-tailwindcss';

esbuild.build({
  plugins: [
    tailwindPlugin({
      // configPath: 'path/to/tailwind.config.js',
    }),
  ],
});

Create file tailwind.config.js at the root of the project:

export default {
  content: ['./source/**/*.{js,jsx,ts,tsx}'],
  // ...
  // The rest of the tailwindcss configuration
  // For more, see: https://tailwindcss.com/docs/configuration
};

Create file index.css:

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

Import index.css from index.{js,jsx,ts,tsx} file:

import './index.css';

Done, you can use the TailwindCSS in the project!