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
$ pnpm add esbuild-plugin-css-module
or
$ npm install esbuild-plugin-css-module
or
$ yarn add esbuild-plugin-css-module
// tsup.config.ts or tsup.config.js
import { defineConfig } from "tsup";
import cssModulePlugin from "esbuild-plugin-css-module";
export default defineConfig(options => ({
...
esbuildPlugins:[cssModulePlugin()]
}));
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
Licensed as MIT open source.
Solution adopte from this discussion.
with 💖 by Mayank Kumar Chaudhari
```