Typescript 5.6.3 throwing error "The inferred type of X cannot be named without a reference to Y. This is likely not portable. A type annotation is necessary."

🔎 Search Terms

"inferred type" "portable" "type annotation is necessary" "cannot be named without a reference to"

🕗 Version & Regression Information

• This changed between versions 5.5.4 and 5.6.3

⏯ Playground Link

https://github.com/livingforjesus/typescript-inferred-type-bug-repro

💻 Code

// Your code here
import { makeStyles } from "tss-react/mui";

// this doesn't work
const PPCTableStyle = makeStyles()({});

export default PPCTableStyle;

🙁 Actual behavior

We have been using typescript v5.5.4 in our project and I wanted to upgrade to v5.6.3(latest). On attempt, the code sample above had a typescript error "The inferred type of 'PPCTableStyle' cannot be named without a reference to '../node_modules/tss-react/types'. This is likely not portable. A type annotation is necessary."

This has been working previously but since 5.5.4->5.6.*, it stopped working and threw this error.

🙂 Expected behavior

I'm expecting this code snippet to work since it has been previously working on earlier versions

Additional information about the issue

We are working in a monorepo and use pnpm version manager. However I was able to repro via yarn in a non-monorepo environment.

Below is the tsconfig

{
  "compilerOptions": {
    "allowJs": false,
    "composite": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "incremental": true,
    "inlineSources": true,
    "isolatedModules": true,
    "noImplicitOverride": true,
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "noEmitOnError": true,
    "noFallthroughCasesInSwitch": true,
    "tsBuildInfoFile": "./dist/.tsbuildinfo",
    "outDir": "./dist",
    "resolveJsonModule": true,
    "rootDir": ".",
    "noEmit": true,
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": false,
    "target": "ES6",
    "jsx": "preserve",
    "lib": ["DOM", "ESNext"]
  },
  "exclude": [
    "./dist",
    "./node_modules",
    "./out",
    "./.next",
    "./dist",
    "./node_modules"
  ],
  "include": ["./next-env.d.ts", "./**/*.ts", "./**/*.tsx"]
}

Beginne mit dem verknüpften Repro-Repository und vergleiche das Verhalten des Beispiels unter TypeScript 5.5.4 und 5.6.3 unter Verwendung der bereitgestellten tsconfig- und Dependency-Konfiguration. Verfolge die Verarbeitung von Deklarationen oder inferierten Typen für makeStyles und ermittle, warum der generierte Typ auf tss-react/types verweist; als erledigt gilt die Aufgabe, wenn das Beispiel ohne manuelle Annotation kompiliert und dabei die gemeldete Regression weiterhin abgedeckt ist.