Directive Comments

VLS has a series of directive comments to control the codegen or diagnostics in the template.

@vue-ignore

Ignore all errors of the next node. For example:

<template>
  <!-- @vue-ignore -->
  <Comp :string="1" />
</template>

@vue-expect-error

If the next node has any errors, suppress them from being reporting, otherwise report an error. For example:

<template>
  <!-- @vue-expect-error suppress errors of next node as expected -->
  <Comp :string="1" />

  <!-- @vue-expect-error trigger a typescript diagnostic because there is no error at the next node -->
  <Comp string="1" />
</template>

@vue-skip

Skip the codegen for the next node. This will cause all typescript features on the node invalid. For example:

<template>
  <!-- @vue-skip -->
  <Comp :string="1" />
</template>

@vue-generic

Set the type arguments for the next node (if it is a generic component). For example:

<template>
  <!-- @vue-generic {number} -->
  <Comp @foo="e => exactType(e, {} as number)" />
</template>