TypeScript is broken
dragosbulugean opened this issue · 8 comments
Hello,
With latest TS (2.7.1) if I import like this:
import * as Oy from 'oy-vey'
The compiler gets stuck (doesn't compile or respond) for whatever reason.
Once I just do:
const Oy = require('oy-vey')
to skip typechecking, everything is fine.
I tried to find out the cause in the Oy type definitions to no avail.
Checking in on this. I created a simple file with TS 2.7.2:
import * as Oy from 'oy-vey';
console.log(Oy);
And things worked fine. Is there a verbose logging mode you can enable in whatever build process you're using?
Running into this as well w/TS 2.7.2. The issue seems to happen when adding attributes, especially to deeply-nested structures, especially with tables. For instance, my file with this in it takes ~13 seconds to compile via tsc:
export const EmailButton = () => (
<Table>
<TBody>
<TR>
<TD>
<Table>
<TBody>
<TR>
<TD />
</TR>
</TBody>
</Table>
</TD>
</TR>
</TBody>
</Table>
);
Now, when I add align="center"
to the innermost TD
, it takes 33 seconds. And, when I add some styles, it takes even longer, about 84 seconds:
<TD
align="center"
style={{
borderRadius: '4px',
backgroundColor: bgColor,
}}
/>
and I'm guessing the more you have of these and reference, the longer it takes for TS to fully check these types. I'm not sure why this is the case - it looks like this package is just using React.DetailedHTMLFactory
.
@revivek i tried to start the compiler with diagnostics, but it still got stuck.
I've upgraded to 2.7.2 too so, issue might be gone.
I'm getting the same problem with the compiler hanging, though I have narrowed it down to these lines which when I replace with any
the compiler will work again:
export const TR: any; //React.DetailedHTMLFactory<Oy.OyTRElementAttributes, HTMLTableRowElement>;
export const TD: any; //React.DetailedHTMLFactory<Oy.OyTDElementAttributes, HTMLTableDataCellElement>;
Using TS 2.7.2.
I'd be very curious to investigate this more but I can't seem to reproduce the issue, however. I created a simple project, which I'm attaching. Would someone be able to post a reproduction?
I ran npm install
and time tsc --jsx react ts.tsx
. The results on my 2013 MBP:
2.38 real 3.74 user 0.14 sys
@revivek I think just adding another couple layers of nesting does the trick 😛
export const EmailButton = () => (
<Table>
<TBody>
<TR>
<TD>
<Table>
<TBody>
<TR>
<TD>
<Table>
<TBody>
<TR>
<TD>
<Table>
<TBody>
<TR>
<TD />
</TR>
</TBody>
</Table>
</TD>
</TR>
</TBody>
</Table>
</TD>
</TR>
</TBody>
</Table>
</TD>
</TR>
</TBody>
</Table>
);
$ time tsc --jsx react ts.tsx
real 0m17.071s
user 0m18.098s
sys 0m0.284s
Afraid I don't quite have the Typescript chops to know what's going on here.
For now I'm following cjdell's comment but can't figure out how to do so without manually going into node_modules
so the change occasionally gets overridden during installs/updates. Do you by chance know how I might be able to do this as an override for now?
Thanks for your work on this lib!
Thanks @mponizil, that did the trick. I've tried several different versions of the typings, which make a difference of a few seconds, but still exhibits the drastic complexity-to-compile-time growth. I'll see if there's a way to instrument the compiler to see what parts are causing hangups.