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

Question

我对 Vue 比较陌生，但精通 Typescript 和 Angular。我目前正在使用 typescript 路线，使用 vue-class-component和 vue-property-decorator vue 文档规定的库。

我使用 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 };
}

hi.html:

<h1>name: {{ info.^ }}</h1>
<h2>age: {{ info.^ }}</h2>

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

Answer 1

也许你应该试试 webstorm ，并安装一个 typeScript 插件来执行此操作。