How to make PhpStorm reflect TypeScript tsconfig.json in .vue files?

Question

I'm using Vue.js (webpack + vueify) and TypeScript. ts configuration seems to be working but only with .ts files.

For example in tsconfig.json I have

  "compilerOptions": {
    "strictNullChecks": false,

So strictNullChecks works fine in .ts files:

But not in .vue:

Error:

Initializer type null is not assignable to variable type string

TypeScript doesn't throw compile errors, only PhpStorm seems to have problems with detecting configuration.

What do I have to do so my configuration in tsconfig.json reflects in .vue files as well?

Answer 1

WebStorm own parser doesn't use your tsconfig.json for errors reporting. Setting "strictNullChecks": false only affects the TypeScript service that is used for error highlighting .ts files by default (if Use TypeScript Service is enabled in Settings | Languages & Frameworks | TypeScript)

But Typescript compiler/service doesn't currently handle .vue files (https://github.com/Microsoft/TypeScript/issues/10427), so it's only enabled for .ts files; for typescript in .vue files, WebStorm own parser is used instead

Another problem is that WebStorm behaves differently in embedded typescript - it accepts assigning null in .ts files, but not in .vue files (https://youtrack.jetbrains.com/issue/WEB-28029)