microsoft / microsoft/TypeScript

Declaration emit inlines types incorrectly

Offen
#57,779 2 Kommentare 7 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Domain: Declaration Emit Help Wanted Possible Improvement
Vorherrschende Sprache
Go
Sterne
111k
Forks
14.4k
Ø Merge
1 T. 19 Std.
Gemergte PRs (30 T.)
117

Beschreibung

🔎 Search Terms

declaration emit inline

🕗 Version & Regression Information

I was unable to test this prior to 4.4 since React types are no longer compatible with that version.

⏯ Playground Link

No response

💻 Code
import * as React from "react";

export class Component extends React.Component<{ children: React.ReactNode }> {
  render() {
    if (Math.random()) {
      return <div>{this.props.children}</div>;
    } else {
      return this.props.children;
    }
  }
}

Full repro: https://github.com/eps1lon/ts-module-auto-export/tree/bad-inline

🙁 Actual behavior

Return value from render() is not referencing React.ReactNode but inlines its (incomplete) union members:

import * as React from "react";
export declare class Component extends React.Component<{
    children: React.ReactNode;
}> {
    render(): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element;
}
🙂 Expected behavior

Return type references the type alias. Inlining union members is incorrect (we may add or remove members or treat members as internal, local types) generally and here specially not even using all members.

export declare class Component extends React.Component<{
  children: React.ReactNode;
}> {
  render(): React.ReactNode | import("react/jsx-runtime").JSX.Element;
}
Additional information about the issue

The fact that it inlines the type here is a special case of https://github.com/microsoft/TypeScript/issues/37151. https://github.com/microsoft/TypeScript/issues/37151 is a more general since it's not always clear when inlining is correct or not. I'd be curious to know what would break if TS would not stop inlining in this special case.

But this issue is also broader since the inline is incomplete.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne mit der verlinkten bad-inline-Reproduktion von ts-module-auto-export und untersuche die Declaration-Emit-Ausgabe von TypeScript für Component.render. Vergleiche den emittierten Rückgabetyp mit der erwarteten React.ReactNode-Referenz und nutze dann issue #37151, um das damit verbundene Inlining-Verhalten zu verstehen; als erledigt gilt die Aufgabe, wenn die Union vollständig und wie gezeigt über den Type Alias emittiert wird.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react, typescript
Bereich
compilers
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
38/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.