Vue+typescript中使用vuex-class装饰器时，vscode报错，但是可以正常编译！

Question

废话不多说，上图！

index.vue 可以看到userName有个红色的波浪线！

错误信息

store也正确配置，页面也能正常显示userName，编译也没报错

有知道这个vscode自己报的错误原因和解决方法吗？

Answer 1

已解决,说下这个问题的原因和解决方法！

vscode为什么会出现这个错误？

实际上还是自己tsconfig.json配置的不正确，在 typeScript 2.7版本之后，引入了一个叫 --strictPropertyInitialization的配置项，官方的说法是：

确保类的非undefined属性已经在构造函数里初始化，若要令此选项生效，需要同时启用--strictNullChecks。默认值是false。更详细请参阅：严格的属性初始化（英文）

然后我看了下我的配置，没有这个东西，继续翻官方配置文档，发现有个strict的东西，如果开启了它也会让strictNullChecks变为true。知道问题根源了就好解决了。

怎么解决？

1. 在 tsconfig.json文件中的compilerOptions节点下添加 "strictPropertyInitialization": false,这样就不会报错了！
2. 如果还想启用空值检查又想不报错的话，可以这样写 @State userName!: string； 前面加个!就不会报错了，意思是告诉typeScript它肯定会有值的你就不用操心了！

Answer 2

一个更好的解决方法是：在属性后加上!

export default class Browser extends Vue {
  @Prop()
  tag!: string

  created(){
     console.log("the tag prop is " + this.tag)
  }
}