评论注释

Vize 提供基于注释的注释来控制 linting、诊断和代码生成行为。根据使用地点不同，有两种注释系统：

• <!-- @vize:xxx -->— <template> HTML注释（Patina linter 指令）

• // @vize forget: reason— JS注释<script>（跨文件分析抑制）

所有@vize:模板指令都被剥离了构建输出——它们从生产代码中从未出现。

模板指令（@vize:）

在<template>内部用作HTML注释。这些控制了铜浆（内置的黏液）行为。

@vize:expected

下一条线路会有诊断。如果没有诊断结果，则为无效行动。和@ts-expect-error类似。

<template>
  <ul>
    <!-- @vize:expected -->
    <li v-for="item in items">{{ item }}</li>
  </ul>
</template>

@vize:ignore-start / @vize:ignore-end

压制该区域内的所有诊断。

<template>
  <!-- @vize:ignore-start -->
  <ul>
    <li v-for="item in items">{{ item }}</li>
  </ul>
  <!-- @vize:ignore-end -->
</template>

@vize:level(warn|error|off)

在下一行中覆盖诊断的严重性。

<template>
  <!-- @vize:level(warn) -->
  <img src="/photo.png" />

  <!-- @vize:level(off) -->
  <li v-for="item in items">{{ item }}</li>
</template>

@vize:todo

发出待办事项警告。

<template>
  <!-- @vize:todo add loading state -->
  <div>{{ data }}</div>
</template>

@vize:fixme

发出FIXME错误。

<template>
  <!-- @vize:fixme broken on mobile -->
  <div class="layout">...</div>
</template>

@vize:deprecated

发出退役警告。

<template>
  <!-- @vize:deprecated use NewComponent instead -->
  <OldComponent />
</template>

@vize:docs

文档评论。没有绒毛效应。

<template>
  <!-- @vize:docs Primary action button for form submission -->
  <button type="submit">Submit</button>
</template>

@vize:dev-only

标记一个节点，在生产版本中要剥离，保持开发中。

<template>
  <!-- @vize:dev-only -->
  <div class="debug-panel">{{ internalState }}</div>
</template>

摘要

剧本压制（@vize forget）

作为JS评论，在<script>内使用。下一行抑制跨文件分析警告（Croquis）。

语法

<script setup>
// @vize forget: <reason>
<suppressed line>
</script>

需要一个理由——你必须解释为什么需要抑制。

示例

<script setup>
import { inject } from "vue";

// @vize forget: intentionally destructuring for one-time read
const { count } = inject("state");
</script>

如果没有注释，Vize 会警告，拆解反应inject()返回值会破坏反应追踪。

规则

多重抑制

每个@vize forget独立应用于下一个代码行：

<script setup>
import { inject } from "vue";

// @vize forget: one-time read for display name
const { name } = inject("user");

// @vize forget: static config value
const { theme } = inject("config");
</script>

跳过评论

抑制针对下一个code行，跳过注释和空行：

<script setup>
// @vize forget: read-only access
// This comment is skipped
const { count } = inject("state");
</script>

常见原因

无效示例

// @vize forget
const { count } = inject("state");
// ^ Error: requires a reason

// @vize forget because I said so
const { count } = inject("state");
// ^ Error: requires a colon before the reason

// @vize forget:
const { count } = inject("state");
// ^ Error: reason cannot be empty