2018.3 broke TypeScript Module Augmentation?
Hello,
I'm using Vue with TypeScript, and I am declaring some variables on the Vue instance (namely the store) in a file called `vue.d.ts` using module augmentation:
// noinspection ES6UnusedImports
import Vue from "vue";
import Router, {Route} from "vue-router";
import {Store} from "../store";
declare module "vue/types/vue" {
interface Vue {
store: Store;
$router: Router;
$route: Route;
$q: any;
}
}
This is to let TypeScript know that the instance does have those variables.
After upgrading to WebStorm 2018.3, I'm getting a errors about "unresolved variables" when trying to access them from within my code:
import Vue from 'vue'
// ...
@Component
export default class Person extends Vue {
// ...
async mounted() {
this.result = await getResult(this.store); // here "this.store" is apparently not declared
}
}
Identical code showed no errors in the previous version of WebStorm (2018.2?), and the code still compiles with no errors or warnings w/ TS compiler v3.1.3.
Any help is appreciated.
Please sign in to leave a comment.
Works fine for me using similar code:
Did you try invalidating caches? If it doesn't help, please share a sample projecrt that can be used to recreate the issue
Hmm, you are correct, when I create a new project it works fine also.
I did 'Invalidate Caches / Restart' already, is there anything else in the settings that could affect where does WebStorm load its types from?
Anything - other project files, libraries, installed modules, project roots setup, etc.
One clue I found is that in 2018.3, when I open the vue.d.ts file in the project that works correctly, I see the green I symbols indicating Implementations of the interface; when I open the vue.d.ts file in my (now broken) project, I see no such symbols. (In 2018.2, they are there in both cases.)
Deleting the file and creating it elsewhere in the directory structure doesn't make the I symbols show up either; it simply does not seem to register as a module augmentation; but WebStorm is aware of the definition, as when I created a duplicate file with different definitions, it complained of TS2717.
Nevertheless, I think I was able to isolate the minimal set of files that trigger this? If you would try it yourself, I would be really glad, thank you!
https://transfer.sh/7u0M6/mcve_ts_ma.tgz
Thanks, reproduced!
the problem is that you have `vue` module excluded from indexing, as it's not listed as a dependency in package.json; marking node_modules/vue as not excluded (Mark Directory As/Not Excluded) should solve the issue:
Ah! This is correct and fixed my issue.
Thank you! :)