vue/define-props-declaration スタイル
何をするか
このルールは、defineProps の型宣言スタイルを強制します。型ベースの宣言または実行時宣言のどちらかを使用する必要があります。このルールは <script setup> で lang="ts" が指定された場合にのみ有効です。
なぜ問題なのか
コードスタイルの不整合は混乱を招き、コードの可読性を低下させます。
例
このルールに違反する誤りのあるコードの例：
vue
// "vue/define-props-declaration": ["error", "type-based"]
<script setup lang="ts">
const props = defineProps({
kind: { type: String },
});
</script>
// "vue/define-props-declaration": ["error", "runtime"]
<script setup lang="ts">
const props = defineProps<{
kind: string;
}>();
</script>このルールに準拠する正しいコードの例：
vue
// "vue/define-props-declaration": ["error", "type-based"]
<script setup lang="ts">
const props = defineProps<{
kind: string;
}>();
</script>
// "vue/define-props-declaration": ["error", "runtime"]
<script setup lang="ts">
const props = defineProps({
kind: { type: String },
});
</script>設定
このルールは以下の文字列値のいずれかを受け付けます：
"type-based"
型ベースの宣言を強制します。
"runtime"
実行時宣言を強制します。
使用方法
設定ファイルまたは CLI でこのルールを有効化するには、次のように使用できます：
json
{
"plugins": ["vue"],
"rules": {
"vue/define-props-declaration": "error"
}
}bash
oxlint --deny vue/define-props-declaration --vue-plugin