Force defineExpose at the end of <script>

[Thomasan1999]

Please describe what the rule should do:

The rule would force to have defineExpose at the end of the <script> tag. When <script setup> is used, defineExpose is used as the alternative to return and is often expected to be at the end the same way return was. It also uses the data used in <script> and should therefore not be placed before the data itself. It is similar to vue/define-macros-order where define macros are forced at the beginning of <script>.

What category should the rule belong to?

[X] Enforces code style (layout)
[ ] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

<script setup>
const counter = ref(0);
const title = ref('');

defineExpose({
    counter,
    title,
});

const itemsText = computed(() => `${ counter.value } items`);
</script>

<script setup>
const counter = ref(0);
const title = ref('');

defineExpose({
    counter,
    title,
});

const shown = ref(false);

function show() {
    show.value = true;
}

watch(counter, show);
</script>

Additional context

[FloEdelmann]

I think it could even be part of vue/define-macros-order with a new option. What do you think?

[J-Michalek]

I think it could even be part of vue/define-macros-order with a new option. What do you think?

I agree and would welcome defineExpose to be added to the vue/define-macros-order rule as I ran into issues when I tried to use it right away and it reported invalid rule value.

[waynzh]

@FloEdelmann @Thomasan1999 @J-Michalek I can give this a try.
I recently met this requirement as well and put up a draft PR.

It differs from the original order property, so I added a new Boolean type property called defineExposeLast. However, there are still some implementation details that I may need some help.

• open to suggestions for a better option name…
• Should we include defineExpose within the order schema? There is a potential conflict in the options, like:
  { order: ['defineExpose', 'defineProps'], defineExposeLast: true }