Allow minimal type checking of JavaScript files

[nwshane]

I'm in the process of introducing TypeScript support into an enormous, 6-year old web application with a lot of JavaScript files. In order to get the most advantages out of TypeScript while we slowly migrate over (which will likely happen slowly), I'd like the following to be true:

• TypeScript files (.ts and .tsx) are type checked with strict: true, so that we get as much useful feedback about TS code as possible.
• JavaScript code that imports and then incorrectly uses typed TypeScript code throws a TS error
• Other TypeScript errors in JavaScript files are suppressed, because we haven't had the chance to migrate the file to TypeScript yet. OR, at the least, JavaScript files are type checked with strict: false to minimize the number of errors they output.

Primary Suggestion

It would be fantastic if typescript had a "minimalCheckJs" config option that, when set to true, would only check JS files for errors on imported typed code. For example, setting "minimalCheckJs": true, "strict": true in tsconfig.json would have this effect:

# moduleA.ts
function hello(msg) {} # throws "no implicit any" error on "msg" arg

export default function logA(msg: string) {
  console.log(msg);
}

# moduleB.js
import logA from './moduleA'
import something from './someJavaScriptFile.js' # does not throw "cannot find module" error

logA(1) # throws TS error, because logA is typed

function logB(msg) { # does not show "no implicit any" error on "msg" arg
  console.log(msg);
}

This feature would allow me to convert a file from JS to TS, add types to the file, and immediately be assured that the exported code is being used correctly throughout my entire code base (including JS files). Currently, I can set "checkJs": true, but then I will see thousands of other kinds of errors that TypeScript finds in the JS files, such as cannot find module errors.

Alternative Suggestion

If the above feature is difficult to implement, a less ideal but also helpful feature would be to allow setting "strict": false for JS files and "strict": true for TS files. Some way to combine the following:

# strictly type check TS files
{
  "compilerOptions": {
    "checkJs": false,
    "allowJs": true,
    "strict": true
  },
  "include": ["**/*.ts", "**/*.tsx"],
}

# type check JS files with strict: false
{
  "compilerOptions": {
    "checkJs": true,
    "allowJs": true,
    "strict": false
  },
  "include": ["**/*.js", "**/*.jsx"],
}

[DanielRosenwasser]

Can you weigh in on options like:

• using checkJs with // @ts-nocheck and // @ts-ignore?
• using only allowJs and opting in on a file-by-file basis with // @ts-check?

[nwshane]

Thanks for the quick response, @DanielRosenwasser! I appreciate your suggestions, but I don't think either of those options satisfy our use case.

Let me give an example. We have a component called LoadingDots, which I've converted to TypeScript and added types to. LoadingDots is imported into ~70 files in the codebase. With a minimalCheckJs config option enabled like the one I describe above, I would get TypeScript feedback on all of the places where we use LoadingDots in the app with no extra work needed, which would be immensely useful.

In order to replicate this feature with // @ts-check, I would have to add // @ts-check to the top of all 70 files containing LoadingDots, and then go through and add // @ts-ignore to all the errors unrelated to LoadingDots. It would be even more tedious to replicate this feature with checkJs: true and // @ts-nocheck, because we would need to add // @ts-nocheck to all the JS files in our codebase except for the 70 files that use LoadingDots, and then once again add lots of // @ts-ignore comments to those files.

Either way it would be a lot of extra work, and not particularly meaningful work either. The errors that I would be ignoring (such as cannot find module errors) will be fixed with time as we migrate our codebase to TypeScript, so I'd much rather they appear when we change the file extension to .tsx?, thus signaling our intent to migrate the file.

[anton164]

I'm also working on converting a large project (> 1000 files) to TypeScript. We're using checkJs and would love a minimalCheckJs option to improve type safety in the JavaScript files.

Currently, the TS compiler gives us > 12 000 errors in our codebase and most of these aren't really that interesting (noImplicitAny/noImplicitThis/etc..), while the errors that could save us from bugs (i.e. calling a function with the wrong parameters) drown in all of the noise.

If we could use a minimalCheckJs: [types of errors that we care about] at build time it would greatly improve our experience with checkJs.

Currently, some devs opt out of checking JavaScript files because it's too noisy and doesn't add that much value. This is somewhat related to another issue I reported (#29810).

[hzhang1902]

Checking Implicit any when checkJs doesn't really make sense, because we can't add types in JavaScript files anyway.

[marcospgp]

@hzhang1902 Yes you can, with JSDoc type annotations

[RickyMarou]

Could this be achieved by having a second tsconfig that only targets JS files and overrides the strict compiler option 🤔 ?

[kopax]

I am generated prisma client (js files) in my workspace, and I have a bunch of error on js files when I set allowJs=true with checkJs=false.

Is there a way to not check at all js ?