在 vue 组件的模板 html 中启用智能感知需要什么?

And*_*tch 5 typescript vue.js visual-studio-code vue-component

我对 Vue 比较陌生,但精通 Typescript 和 Angular。我目前正在走打字稿路线,使用vue 文档规定的vue-class-componentvue-property-decorator库。

我使用 VSCode 作为我的编辑器,并且根据标题,想知道是否有任何工具/插件/IDE 允许在 html 模板中自动完成/智能感知。比如说我的.ts文件是:

hi.ts:

import { Component, Vue, Prop } from 'vue-property-decorator';

interface IInfo {
  name: string;
  age: number;
}

@Component({
  template: require('./hi.html')
})
export default HiComponent extends Vue {
  info: IInfo = { name: 'brosef', age: 30 };
}
Run Code Online (Sandbox Code Playgroud)

你好.html:

<h1>name: {{ info.^ }}</h1>
<h2>age: {{ info.^ }}</h2>
Run Code Online (Sandbox Code Playgroud)

是否有插件或编写插件的方法可以在键入此模板时提供自动完成选项(^hi.html上面的位置)?也许一个插件可以读取链接相应组件类的模板顶部的特殊注释...¯\_(?)_/¯

Kai*_*cui 0

也许你应该尝试webstorm,并安装一个 typeScript 插件来做到这一点。