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.