esbuild-plugin-css-module

We recommend using esbuild-plugin-react18-css

ESBuild plugin to handle CSS/SCSS modules, autoprefixer, etc. while bundling libraries

Create fully treeshakable libraries (import from esbuild-plugin-react18-css/client/component)

Use CSS/SCSS modules - automatically converted to BEM like CSS

fully treeshakable CSS - import only the CSS files your users need

Full TypeScript Support

Unleash the full power of React18 Server components

Works with all build systems/tools/frameworks for React18

Install

$ pnpm add esbuild-plugin-css-module

or

$ npm install esbuild-plugin-css-module

or

$ yarn add esbuild-plugin-css-module

use with tsup

// tsup.config.ts or tsup.config.js
import { defineConfig } from "tsup";
import cssModulePlugin from "esbuild-plugin-css-module";

export default defineConfig(options => ({
    ...
    esbuildPlugins:[cssModulePlugin()]
}));

use with esbuild

import cssModulePlugin from "esbuild-plugin-css-module";

esbuild.build({
	...
	plugins: [cssModulePlugin()],
});

Don't forger to start this repo!

Want handson course for getting started with Turborepo? Check out React and Next.js with TypeScript and The Game of Chess with Next.js, React and TypeScrypt

License

Licensed as MIT open source.

Credits

Solution adopte from this discussion.