Is it okay to put JS files in a tsconfig's includes/files property? Or how else can I make tsc check my JS files in a TS project?

Issue

I am using Visual Studio Code with a project that has a mix of Typescript and Javascript files, because we just adopted Typescript. The project used to just have Javascript files, but by using a jsconfig.json file I was still able get Intellisense (eg. I could CTRL + click on an import to go directly to the imported file).

However, since adopting Typescript (and getting the mix of files), VS Code has stopped offering Intellisense on Javascript files. It works fine in Typescript, and I know for a fact that it's the file extension causing the problem, because if I rename foo.js to foo.tsx, the Intellisense starts working again.

I still have a jsconfig.json file, along with my tsconfig.json file, but clearly that's not enough to make VS Code restore Intellisense to JS files. Can anyone explain how I can do that?

EDIT: Here's my tsconfig.json:

{
  "ts-node": {
    "require": ["tsconfig-paths/register"]
  },
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "checkJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "incremental": true,
    "esModuleInterop": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "paths": {
      "app/*": ["./app/*"],
      "pages/*": ["./pages/*"],
      "src/*": ["./src/*"]
    },
    "plugins": [{ "name": "next" }],
    "strictNullChecks": true,
    "target": "es2015"
  },
  "include": ["next-env.d.ts", ".next/types/**/*.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

Solution

It's fine to put patterns for JS files in a tsconfig's includes/files property. As for technicalities, I'm not sure if that causes the TypeScript compiler to think of those files as TypeScript files, but I'm pretty sure it doesn't matter too too much.

See https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html#moving-to-typescript-files and Is any JavaScript code a valid TypeScript code? (answer is yes).

I think to get TypeScript to do checking in JS files, the JS file needs to either be included in the project via tsconfig, or imported by a file that is included in the project (see https://www.typescriptlang.org/tsconfig#checkJs).

Answered By - starball