Monorepo shared ui throwing module not found on pnpm build | Next.js | Page 1

I have a monorepo with the following folder structure represented in json:

"apps": ["admin", "web"],
"packages": ["shared-ui"]

shared-ui is a next.js app that has index.ts in the root exporting all of it's components

// shared-ui
//   index.ts
//   next-config.js
//   app
//     ...this folder is empty since I am only using shared-ui to export components

// imports global styles that should be applied to all shared-ui components
import "./src/styles/globals.css" 

// exports all components that should be used in apps
export { default as Header } from "~/components/common/header/header"
export { default as Footer } from "~/components/common/footer/footer"

I can then import these in my apps like this:

import { Header } from "@repo/shared-ui"
import { Footer } from "@repo/shared-ui"

this works well in dev and I can see the components and their styles applied from "globals.css", but when I run pnpm --filter admin run build it gives me the following error:

Import trace for requested module:
./src/app/preview/page.tsx

../../packages/shared-ui/index.ts
Module not found: Can't resolve '~/components/common/header/header'

Any ideas?

#Monorepo shared ui throwing module not found on pnpm build