Giuseppe Maggiore
Giuseppe Maggiore

Reputation: 2031

VSCode TypeScript Intellisense suddenly broken after 1.7 -> 1.6 downgrade

I am facing a weird issue. Since yesterday my setup was working perfectly with a largish rails, react, and typescript project.

This morning, as I opened the editor, VS Code was suddenly broken. I now get error

[ts] Cannot use JSX unless the '--jsx' flag is provided

in all of my .tsx files. Even more surprisingly, compilation still works without issue.

This seems inline with the warning I am suddenly getting: Version mismatch! global tsc (2.0.7) != VS Code's language service (2.0.6). Inconsistent compile errors might occur.

My directory structure is that of a rails project, plus the react_on_rails gem. This means that I have a client folder with a webpack installation, and inside the client folder we find the tsconfig file. tsconfig contains the following:

"compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "module": "commonjs",
    "target": "es6",
    "jsx": "react",
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "isolatedModules": true,
    "experimentalDecorators": true,
    "maxNodeModuleJsDepth": 5
},

How do I go about debugging something like this?

Upvotes: 2

Views: 568

Answers (1)

Giuseppe Maggiore
Giuseppe Maggiore

Reputation: 2031

For whomever might be interested, the solution was quite trivial.

I was using webpack, so the list of files in tsconfig.json was not really needed: after all, webpack goes through the files it finds, matches extensions, and applies its loaders. Indeed, compilation worked correctly.

It appears that (not unreasonably) VS Code uses the files listed in tsconfig.json to determine which files will receive intellisense according to the parameters specified in the tsconfig.json file itself.

The solution was therefore simply to add references to all of my *.ts and *.tsx files in tsconfig.json to restore intellisense to perfection.

Upvotes: 1

Related Questions