typescript - vue-class-component mixins 在 WebStorm 中引发错误？

Question

我正在使用 vue-js 和 TypeScript 开发一个项目。所以我试了一下 vue-class-component。

我正在尝试编写一个 mixin，它在 VSC 和 VS 中运行良好，但似乎 WebStorm 对我的代码不是很满意。

这是混音:

import Vue from 'vue'
import {StoreOptions} from 'vuex'
import Component from "vue-class-component";

@Component
export default class Container extends Vue {
  registerStoreModule(key: string, module: StoreOptions<any>): void {
    if (!this.$store.state[key]) {
      this.$store.registerModule(key, module);
    }
  }
}

这里是使用这个 mixin 的组件:

  @Component({
    components: { UserCard },
    computed: mapGetters({ user: `${STORE_KEY}/user` })
  })
  export default class UserContainer extends mixins(Container) {
    user: UserState;

    created() {
      this.registerStoreModule(STORE_KEY, store)
    }

    mounted() {
      this.$store.dispatch(`${STORE_KEY}/getUser`);
    }
  }

根据 vue-class-component ，这应该有效。问题是 WebStorm 无法检查 TypeScript 类型。

有两个错误:

• 参数类型与参数不匹配
• 基础构造函数必须具有相同的返回类型

代码编译良好，其他 IDE 不会捕获这些错误。我尝试过不同版本的 TS，目前我使用的是 2.8.3。 Visual Studio Code 使用与 WebStorm 相同的版本。

编辑:这是我的 tsconfig.json，它很有用:)

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "node",
      "mocha",
      "chai"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    }
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.vue",
    "tests/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

Answer 1

已知问题请关注WEB-31543更新