'Can I disable TypeScript Inference for imported JS Modules? (Or config it to always infer type: any)
I'm trying to use a JS module in a TypeScript File. But, because the JS module does not have any type declarations I'm unable to use the JS module because of TypeScript errors
The problem happens because of a default argument in the JS imported function that TypeScript infers as being of one type when it is not.
I know the problem probably only exists because of stupid usage of the default argument, and of a badly written function. But I cannot edit the JS module to correct it.
The real problem is with a React Component that has a prop that defaults to false (const El = ({prop1, prop2 = false})=>{...}) but could also receive a number. Then, when calling the component in the TS file, and when setting that prop to a number (<El prop1={1} prop2={3}/>), TypeScript complains with "Argument of type 'number' is not assignable to parameter of type 'boolean | undefined'."
To simplify, here is an equivalent non-React example:
So, let's imagine one has a TypeScript project with "allowJS": true set so a JS module can be imported.
//externalModule.js
//Can't edit this file
export const addOneOrMore = (a, b = false) => {
if(b == false)
return a + 1
else
return a + b
}
//typescriptFile.ts
import addOneOrMore from "./externalModule.js"
let one: number = 1
let three: number = 3
console.log(addOneOrMore(one,three)) // TS Error: "Argument of type 'number' is not assignable to parameter of type 'boolean | undefined'."
I know that what is happening is that the TS Compiler is inferring that, because the argument defaults to false, it is of the type boolean.. And because of that, I can't pass a number to it.
I think that in this case it doesn't make a lot of sense to infer that (at least for imported JS modules without type declarations)
So, my questions are:
- Can I set TSConfig or TypeScript in any way so it overrides the JS inferring always with
: any? - Does it make sense to infer
boolean | undefinedis that case? Whyundefined? Why is more likely that someone would actively passundefinedspecifically to a default argument than any other type? Why notboolean | nullor anything else? - Is there any other way that allows me to use that module in a TS file?
Thanks a lot!
Solution 1:[1]
The JS module does not have any type declarations. […] But I cannot edit the JS module to correct it. […] Is there any other way that allows me to use that module in a TS file?
Yes, there is: you can use a declaration file! Just create externalModule.d.ts file, put the proper type declarations in it, and you can use the library as-is.
Solution 2:[2]
In TypeScript 3.7, type checking will be disabled on a file if it starts with the following comment:
// @ts-nocheck
As already mentioned, in previous versions you can disable checking on a single line by including the following comment on the previous line:
// @ts-ignore
In your case, you can try this:
//typescriptFile.ts
import addOneOrMore from "./externalModule.js"
let one: number = 1
let three: number = 3
// @ts-ignore
console.log(addOneOrMore(one,three))
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Bergi |
| Solution 2 | Krushnal Patel |
