`vue/no-bare-strings-in-template`

国際化すべきテンプレートの直接指定テキストを検出します。

既定の重大度: warning
プリセット: none
自動修正: なし。修正内容を確認してください
適用範囲: Vue SFC のテンプレート・ブロック。必要な script の文脈も例に含めています。
オプション: ルール固有のオプションはありません。重大度とプリセットは設定できます。

設定（Vite+）

import { defineConfig } from "@vizejs/vite-plugin/vite-plus";

export default defineConfig({
  lint: {
    vize: {
      "preset": "incremental",
      "rules": {
        "vue/no-bare-strings-in-template": "warn"
      }
    },
  },
});

vp run lint

悪い

表示する文字や名前を指定する属性に、翻訳を通さない文字列を直接書いています。

<template>
<div>hello</div>
<img alt="a cat" />
<input placeholder="Search" />
<button title="Close">x</button>
</template>

良い

翻訳する内容を $t で取得します。記号だけ、数値だけの内容は例外です。

<template>
<div>{{ $t('hello') }}</div>
<img :alt="$t('cat')" />
<div>-</div>
<div>123</div>
<button :title="$t('close')">{{ $t('x') }}</button>
</template>

良い例は上記の設定でこのルールの検出を避ける例です。他のルールでは検出される場合があります。

実装 · 全ルール