define-macros-order.md

Pattern: Wrong defineProps/defineEmits macro order

Issue: -

Description

This rule reports the defineProps and defineEmits compiler macros 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

{
  "vue/define-macros-order": ["error", {
    "order": ["defineProps", "defineEmits"]
  }]
}

• order (string[]) ... The order of defineEmits and defineProps macros

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

<!-- ✓ GOOD -->
<script setup>
defineProps(/* ... */)
defineEmits(/* ... */)
</script>

<!-- ✗ BAD -->
<script setup>
defineEmits(/* ... */)
defineProps(/* ... */)
</script>

<!-- ✗ BAD -->
<script setup>
const bar = ref()
defineProps(/* ... */)
defineEmits(/* ... */)
</script>

Further Reading

• eslint-plugin-vue - define-macros-order