Challenges with Supporting Server Components Due to Bundling Configuration

[HamzaAmar]

I'm facing an issue with bundling my React library using Tsup, specifically when trying to support server components. The previous configuration bundled everything into one file, which caused conflicts with components that needed to be loaded as server components.

I'm attempting to bundle each component separately and use a barrel index file to gather them, applying the 'use client' directive only where necessary. However, this new configuration is resulting in a ERR_WORKER_OUT_OF_MEMORY error.

this is the ISSUE FROM GITHUB my LIbrary If you want to suggest some help or contribute

Previous Tsup Configuration

import { defineConfig } from 'tsup'

export default defineConfig((option) => ({
  entry: ['src/index.ts'],
  format: ['cjs', 'esm'],
  splitting: false,
  sourcemap: true,
  clean: true,
  dts: true,
  treeshake: true,
  external: ['react', 'react-dom'],
  minify: !option.watch,
}))

New Tsup Configuration

export default defineConfig({
  sourcemap: true,
  entry: ['./src/index.ts', './src/core/**/index.tsx'],
  format: ['cjs', 'esm'],
  splitting: false,
  outDir: 'dist/',
  dts: true,
  minify: true,
  treeshake: true,
  external: ['react', 'react-dom'],
  bundle: false,
  esbuildOptions(options, context) {
    options.outbase = './'
  },
})

Error

@pillar-ui/core:dev: Error [ERR_WORKER_OUT_OF_MEMORY]: Worker terminated due to reaching memory limit: JS heap out of memory

Goals

1. Bundle each component separately.
2. Add the "use client" directive to the components that require it.

I'm developing an open-source UI library, and I'm aiming to ensure it seamlessly supports the 'use client' directive by default this is the link of the issue in github for more info Pillar ui.

Any help in resolving this issue or suggestions for improving the bundling configuration would be greatly appreciated!