internal ui package build with tsdown, consuming via next.js

Question

i've a ui package build with tsdown, and exported using barrel file (index.ts) exporting all the components, and ui related hooks.

the ui package contains both next.js specific server components and client side components, and when i import a server component, i'm getting an error.

how to make both next.js and tsdown work correctly?

Thick-billed Vireo · Answer

after researching i've found this, to split tsdown entry points server & client files, is this the standard way?// packages/ui/tsdown.config.ts
import { defineConfig } from "tsdown";

export default defineConfig({
  entry: {
    index: "src/index.ts",      // client bundle
    server: "src/server.ts",    // server bundle
  },
  format: ["esm"],              
  dts: true,                    
  clean: true,
  external: ["react", "react-dom", "next"]
});

internal ui package build with tsdown, consuming via next.js

1 Reply