flowgen icon indicating copy to clipboard operation
flowgen copied to clipboard

Incompactible with Typescript 4.5.x

Open valentinpalkovic opened this issue 4 years ago • 0 comments

With Typescript 4.5.x some types are generated differently:

Source:

import React from 'react';

export declare type TInput = {
    onBlur: React.FocusEventHandler<any>;
    property1: Record<string, any>;
};
export {};

Generated output with Typescript 4.4.5:

import React from "react";

export type TInput = {
  onBlur: React.FocusEventHandler<any>,
  property1: { [key: string]: any, ... },
  ...
};
declare export {};

Generated output with Typescript 4.5.4:

import React from "react";

export type TInput = {
  onBlur: React$FocusEventHandler<any>,
  property1: Record<string, any>,
  ...
};
declare export {};

Changes:

  • React.FocusEventHandler becomes React$FocusEventHandler - is the Typescript 4.5.x output even expected and it was not working in 4.4.x properly?
  • The Record is not transformed anymore.

Debugging:

Depending on which package manager you use, it can happen that it "tricks" you. I wanted to upgrade Typescript and try different versions out, but I recognized, that sometimes a Typescript folder will be placed into ./node_modules/flowgen/node_modules. Its version doesn't reflect necessarily the version of Typescript you have defined in the package.json. Indeed, if a clean install happens without having a yarn.lock file, yarn doesn't nest a different Typescript version in the flowgen folder. Or just delete it manually to be sure to always use the Typescript folder in the root node_modules folder. The Flowgen package itself doesn't define a fixed Typescript version and allows everything from 4.0.0 until < 5.0.0.

I will try to debug the issue and provide a MR in the next days, if I find some time for it! :)

valentinpalkovic avatar Dec 21 '21 09:12 valentinpalkovic