Monorepo — TypeScript Project References with Shared Types

Problem/Feature Description

A growing SaaS company has a React dashboard (frontend), a Node.js API (backend), and a growing set of types shared between them. Currently everything is in one flat project, but the frontend and backend have conflicting dependency versions and the shared types are getting complex enough to warrant their own package with its own tests.

The team wants to migrate to a monorepo using npm/pnpm workspaces with three packages: @app/shared (types and validation schemas), @app/server (Express API), and @app/client (React dashboard). They want TypeScript project references so that tsc --build compiles everything in the correct dependency order.

Output Specification

Produce the monorepo structure with:

• package.json — Root package.json with workspaces configuration
• tsconfig.json — Root tsconfig.json with project references to all three packages
• packages/shared/package.json — Shared package with name "@app/shared"
• packages/shared/tsconfig.json — Composite tsconfig with declaration output
• packages/shared/src/types.ts — Shared types: User, DashboardWidget, ApiResponse, Permission union type
• packages/shared/src/index.ts — Barrel export
• packages/server/package.json — Server package depending on @app/shared
• packages/server/tsconfig.json — Server tsconfig with project reference to shared
• packages/server/src/index.ts — Express entry point importing from @app/shared
• packages/client/package.json — Client package depending on @app/shared
• packages/client/tsconfig.json — Client tsconfig with project reference to shared
• packages/client/src/App.tsx — React component importing from @app/shared

Focus on correct tsconfig project references (composite, references, declaration), workspace configuration, and proper inter-package imports. Implementation can be minimal.