Hi all,
Having a slight issue with typescript and drei Text3D. I followed the instructions on GitHub - pmndrs/drei: 🥉 useful helpers for react-three-fiber. Went into Google fonts, downloaded a font, converted to JSON through Facetype.js. I then loaded it in and it works! However, typescript is throwing an error when compiling. I tried disabling linting as show below but I’m still getting the error. Any ideas on how to get around this?
*EDIT: I was able to get around this by adding // @ts-nocheck
to the top of the file. Keeping this post open incase anyone has more insights on this.
*EDIT2: Also had to add // eslint-disable-next-line @typescript-eslint/ban-ts-comment
before // @ts-nocheck
as the typescript compiler was complaining about that as well.
Type error: Type '{ glyphs: { "0": { ha: number; x_min: number; x_max: number; o: string; }; "1": { ha: number; x_min: number; x_max: number; o: string; }; "2": { ha: number; x_min: number; x_max: number; o: string; }; "3": { ha: number; x_min: number; x_max: number; o: string; }; ... 889 more ...; Ὅ: { ...; }; }; ... 9 more ...; css...' is not assignable to type 'string | FontData'.
Type '{ glyphs: { "0": { ha: number; x_min: number; x_max: number; o: string; }; "1": { ha: number; x_min: number; x_max: number; o: string; }; "2": { ha: number; x_min: number; x_max: number; o: string; }; "3": { ha: number; x_min: number; x_max: number; o: string; }; ... 889 more ...; Ὅ: { ...; }; }; ... 9 more ...; css...' is not assignable to type 'FontData'.
Types of property 'glyphs' are incompatible.
Type '{ "0": { ha: number; x_min: number; x_max: number; o: string; }; "1": { ha: number; x_min: number; x_max: number; o: string; }; "2": { ha: number; x_min: number; x_max: number; o: string; }; "3": { ha: number; x_min: number; x_max: number; o: string; }; ... 889 more ...; Ὅ: { ...; }; }' is not assignable to type '{ [k: string]: Glyph; }'.
Property '"0"' is incompatible with index signature.
Property '_cachedOutline' is missing in type '{ ha: number; x_min: number; x_max: number; o: string; }' but required in type 'Glyph'.
38 | /* tslint:disable */
39 | /* eslint-disable */
> 40 | <Text3D font={roboto}>
| ^
41 | T4
42 | <meshNormalMaterial />
43 | </Text3D>