`define-macros-order`: should allow referencing local variables defined before the macros statement

[andreww2012]

What did you do?

define-macros-order should probably allow referencing local variables defined before the macros:

<script setup lang="ts">
/* eslint vue/define-macros-order: [2, {order: ["defineOptions", "defineModel", "defineProps", "defineEmits", "defineSlots"]}] no-use-before-define: 2 */
import {ref} from 'vue';

const lastSetModelValue = ref<string>();
// "defineModel should be the first statement in `<script setup>` (after any potential import statements or type definitions)",
// but it's not safe to move `lastSetModelValue` after the macros
const [modelValue, modelModifiers] = defineModel<string>({
  set: (value: string) => {
    lastSetModelValue.value = value;
    return value;
  },
  get: (value: string) => {
    return lastSetModelValue.value ?? value;
  },
});
</script>

What did you expect to happen?

The rule should not report .

If lastSetModelValue definition is moved below defineModel, no-use-before-define will be triggered as well as define-macros-order on the following macros definitions.

Repository to reproduce this issue

Reproduction

[ota-meshi]

but it's not safe to move lastSetModelValue after the macros

Why is it not safe? Could you provide a concrete example where we can see that it is not safe?

[andreww2012]

I think my wording wasn't fully correct - it only might be unsafe because you're required to ensure any potential accesses to modelValue performed before the initialization of lastSetModelValue, which makes your code more fragile, and you also get reports from no-use-before-define as well as lose the ability to put the related code together.

Vue playground example

[ota-meshi]

So it's technically safe, right? If so, I think it's a stylistic issue, and it would be good to add an option to handle it. Please open a PR if you're interested.