Uncaught SyntaxError: Must be called at the top of a `setup` function vue 3

Если в кратце: проблема в том, что ваша функция должна быть вызвана вверху функции setup(), а не быть вложенной в другую функцию (вызов которой происходит из setup()).

Проще понять наглядно, почему может возникнуть ошибка Uncaught SyntaxError: Must be called at the top of a `setup` function, на примере моего случая, когда для тестов я решил обернуть axios.get() в setTimeout:

<script>
    import { ref } from 'vue'
    import ui_state from "../state";
    import axios from "axios";

    export default {
        name: 'Component',

        setup() {
            const { locale_url } = ui_state

            const data = ref('')

            setTimeout(() => {
                axios.get(locale_url('/apps/'))
                    .then(response => {
                        data.value = response.data;
                    })
            }, 1000);

            return {
                data
            }
        }
    }
</script>

Консоль выдавала ошибку:

Uncaught SyntaxError: Must be called at the top of a `setup` function
    at createCompileError (message-compiler.esm-bundler.js?f92f:32)
    at createI18nError (vue-i18n.esm-bundler.js?47e2:71)
    at useI18n (vue-i18n.esm-bundler.js?47e2:1928)
    at locale_url (state.js?faae:25)
    at eval (Component.vue?5ea5:49)

Проблема оказалась в том, что в мой скрипт ui_state (который я создал для хранения общего состояния приложения) я использую useI18n(), который импортировал с библиотекри vue-i18n:

import { reactive } from 'vue';
import { useI18n } from 'vue-i18n'

const state = reactive({
    base_url: 'http://localhost:8000/'
});

const locale_url = (url) => {
    const { locale } = useI18n()
    return state.base_url + '/' + locale.value + url
}

const ui_state = {
    locale_url
}

export default ui_state

В моём случае функия locale_url() служит для формирования url в зависимости от используемого языка.

Так как функия locale_url() находилась в другой функции, а не в setup(), то и возникала ошибка. Ошибки не было бы, если бы в функции locale_url() не использовался бы useI18n(). Но мне нужно его использовать для получения текущего locale.

Для решения моего примера достаточно вычислить url до использования setTimeout:

<script>
    import { ref } from 'vue'
    import ui_state from "../state";
    import axios from "axios";

    export default {
        name: 'Component',

        setup() {
            const { locale_url } = ui_state

            const data = ref('')

            const url = locale_url('/apps/')
            setTimeout(() => {
                axios.get(url)
                    .then(response => {
                        data.value = response.data;
                    })
            }, 1000);

            return {
                data
            }
        }
    }
</script>