eslint-plugin-vue

Appearance

vue/define-macros-order ​

enforce order of compiler macros (defineProps, defineEmits, etc.)

  • 🔧 The --fix option on the command line can automatically fix some of the problems reported by this rule.
  • 💡 Some problems reported by this rule are manually fixable by editor suggestions.

📖 Rule Details ​

This rule reports compiler macros (like defineProps or defineEmits but also custom ones) when they are not the first statements in <script setup> (after any potential import statements or type definitions) or when they are not in the correct order.

🔧 Options ​

json
{
  "vue/define-macros-order": ["error", {
    "order": ["defineProps", "defineEmits"],
    "defineExposeLast": false
  }]
}
  • order (string[]) ... The order in which the macros should appear. The default is ["defineProps", "defineEmits"].
  • defineExposeLast (boolean) ... Force defineExpose at the end.

{ "order": ["defineProps", "defineEmits"] } (default) ​

Now loading...
Now loading...
Now loading...

{ "order": ["defineOptions", "defineModel", "defineProps", "defineEmits", "defineSlots"] } ​

Now loading...
Now loading...
Now loading...

{ "order": ["definePage", "defineModel", "defineCustom", "defineEmits", "defineSlots"] } ​

Now loading...
Now loading...

{ "defineExposeLast": true } ​

Now loading...
Now loading...

🚀 Version ​

This rule was introduced in eslint-plugin-vue v8.7.0

🔍 Implementation ​