How to fix Expression produces a union type that is too complex to represent in TypeScript

// BEFORE: TypeScript tries to infer complex union
const config = {
  ...defaultConfig,
  ...themeConfig,
  ...variantConfig,
};

// AFTER: Explicitly type the result
interface Config {
  theme: string;
  variant: string;
  // ... other properties
}

const config: Config = {
  ...defaultConfig,
  ...themeConfig,
  ...variantConfig,
};

// BEFORE: Complex inference
<Button {...complexProps} />

// AFTER: Type the props explicitly
const buttonProps: ButtonProps = { ...complexProps };
<Button {...buttonProps} />

// BEFORE: One massive type
type ComplexConfig = VariantA | VariantB | VariantC | ... // 100 variants

// AFTER: Group into categories
type SizeVariants = "sm" | "md" | "lg";
type ColorVariants = "primary" | "secondary" | "tertiary";
type ComponentConfig = {
  size: SizeVariants;
  color: ColorVariants;
};

// BEFORE: Spreading many complex objects
const allProps = { ...propsA, ...propsB, ...propsC, ...propsD };

// AFTER: Merge incrementally with explicit types
const intermediateProps: IntermediateType = { ...propsA, ...propsB };
const finalProps: FinalType = { ...intermediateProps, ...propsC };

# Delete the build cache file
rm tsconfig.tsbuildinfo

# Also clear node_modules cache if using TypeScript from dependencies
rm -rf node_modules/.cache

# Rebuild from scratch
npm run build
# or
npx tsc --build --clean
npx tsc --build

// BEFORE: Complex union inference
const result = complexFunction(args);

// AFTER: Assert the specific type
const result = complexFunction(args) as SpecificType;

// Use any as an escape hatch (use sparingly!)
const intermediate = complexExpression as any;
const result = intermediate as ExpectedType;

// Instead of letting TypeScript compute all combinations
type Result = ComponentVariantA | ComponentVariantB;

if (isVariantA(props)) {
  // TypeScript knows it's ComponentVariantA here
  return <ComponentA {...props} />;
} else {
  return <ComponentB {...props} />;
}

# Check your current version
npx tsc --version

# Try a different version
npm install --save-dev [email protected]
# or
npm install --save-dev [email protected]

{
  "compilerOptions": {
    // Reduce type-checking strictness temporarily to isolate the issue
    "skipLibCheck": true,

    // Disable incremental builds if cache is problematic
    "incremental": false,

    // For libraries, sometimes this helps
    "moduleResolution": "node",

    // Ensure proper type resolution
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true
  }
}

{
  "compilerOptions": {
    "skipLibCheck": true  // Skip type checking in node_modules
  }
}