Skip to content

Typescript generics, TSX and trailing commas (prettier generates invalid syntax) #6114

@jleclanche

Description

@jleclanche

Background

I was trying to have a generic function in a tsx file, but was using const f = () ... syntax. When a single-argument generic is added to that style of function, the parser switches to TSX mode.
I came across this SO answer which explains that the parser will not switch to TSX mode if more than one generic argument is present.

So I discovered you can just add a trailing comma without having to have more than one argument. Problem is, prettier doesn't like that trailing comma and it gets cleaned up, which generates invalid tsx.

Reproduction

Run prettier over this:

type G<T> = any;
const myFunc = <T,>(arg1: G<T>) => false;

The generic's trailing comma gets removed, and it gets turned into the following invalid TSX (but valid TS):

type G<T> = any;
const myFunc = <T>(arg1: G<T>) => false;

Metadata

Metadata

Assignees

No one assigned

    Labels

    lang:typescriptIssues affecting TypeScript-specific constructs (not general JS issues)locked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.status:has prIssues with an accompanying pull request. These issues will probably be fixed soon!

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions