error TS4058: Return type of exported function has or is using name 'SubmitEventPromise' from external module "/.../node_modules/vuetify/lib/components/index" but cannot be named.

[NathanAP]

Vue - Official extension or vue-tsc version

2.1.6

VSCode version

1.91.1

Vue version

3.5.7

TypeScript version

5.6.2

System Info

(not sure if this fits because I'm using Gitpod)

System:
    OS: Linux 6.1 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 AMD EPYC 7B13
    Memory: 54.94 GB / 62.79 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.17.0 - ~/.nvm/versions/node/v20.17.0/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v20.17.0/bin/yarn
    npm: 10.8.2 - ~/.nvm/versions/node/v20.17.0/bin/npm
    pnpm: 9.9.0 - ~/.nvm/versions/node/v20.17.0/bin/pnpm
    bun: 1.1.29 - ~/.nvm/versions/node/v20.17.0/bin/bun

package.json dependencies

{
    "dependencies": {
        "@date-io/date-fns": "^3.0.0",
        "@fortawesome/fontawesome-free": "^6.6.0",
        "@fortawesome/fontawesome-svg-core": "^6.6.0",
        "@fortawesome/free-brands-svg-icons": "^6.6.0",
        "@fortawesome/free-regular-svg-icons": "^6.6.0",
        "@fortawesome/free-solid-svg-icons": "^6.6.0",
        "@fortawesome/vue-fontawesome": "^3.0.8",
        "@types/chart.js": "^2.9.41",
        "@types/lodash": "^4.17.7",
        "@types/markdown-it": "^14.1.2",
        "@vueuse/core": "^11.1.0",
        "axios": "^1.7.7",
        "buffer": "^6.0.3",
        "chart.js": "^4.4.4",
        "core-js": "^3.38.1",
        "date-fns": "^3.6.0",
        "lodash": "^4.17.21",
        "markdown-it": "^14.1.0",
        "maska": "^3.0.2",
        "v-onboarding": "^2.8.2",
        "vue": "^3.5.7",
        "vue-advanced-cropper": "^2.8.9",
        "vue-chartjs": "^5.3.1",
        "vue-debounce": "^5.0.0",
        "vue-i18n": "^10.0.1",
        "vue-router": "^4.4.5",
        "vuetify": "^3.7.2",
        "yup": "^1.4.0"
    },
    "devDependencies": {
        "@babel/types": "^7.25.6",
        "@types/node": "^22.5.5",
        "@vitejs/plugin-vue": "^5.1.4",
        "@vue/eslint-config-typescript": "13.0.0",
        "eslint": "^8.56.0",
        "eslint-config-standard": "^17.1.0",
        "eslint-config-vuetify": "^1.0.0",
        "eslint-plugin-import": "^2.30.0",
        "eslint-plugin-n": "^16.6.2",
        "eslint-plugin-node": "^11.1.0",
        "eslint-plugin-promise": "^6.4.0",
        "eslint-plugin-vue": "^9.28.0",
        "pinia": "^2.2.2",
        "pinia-plugin-persistedstate": "^4.0.1",
        "prettier": "^3.3.3",
        "sass": "^1.79.3",
        "typescript": "^5.6.2",
        "unplugin-auto-import": "^0.18.3",
        "unplugin-fonts": "^1.1.1",
        "unplugin-vue-components": "^0.27.4",
        "unplugin-vue-router": "^0.10.8",
        "vite": "^5.4.5",
        "vite-plugin-vue-layouts": "^0.11.0",
        "vite-plugin-vuetify": "^2.0.4",
        "vue-tsc": "^2.1.6"
    }
}

Steps to reproduce

This is a copy of this because I don't think this is Vuetify fault (probably is mine of course).

Since one or two days ago, when I run npm run build, I'm getting this:

I started to search for what it could be causing it, but I could not find anything. Today I tried to remove part of the code and when I remove my slot, it stop throwing error (one of them at least). I'm not sure what could be causing it. Here's the code of one of them:

<script setup lang="ts">
import { computed, Ref, ref } from 'vue'
import { VForm } from 'vuetify/components'
import { useI18n } from 'vue-i18n'
import PrimaryButton from '@/components/buttons/PrimaryButton.vue'
import SecondaryButton from '@/components/buttons/SecondaryButton.vue'
import { DefaultFilterProps } from '@/helpers/components/filters'

const props = withDefaults(defineProps<DefaultFilterProps>(), {
    disabled: false,
})
const emit = defineEmits(['filter', 'clear'])

const { t } = useI18n({ useScope: 'global' })

const form: Ref<InstanceType<typeof VForm> | undefined> = ref()

const clearButtonText = computed(() => {
    if (props.clearButtonText) return props.clearButtonText
    return t('main.clear')
})
const searchButtonText = computed(() => {
    if (props.searchButtonText) return props.searchButtonText
    return t('main.search')
})

async function execAction() {
    if (!form.value || !(await form.value.validate()).valid) return

    emit('filter')
}
</script>

<template>
    <v-card rounded="xl">
        <v-card-title>
            <v-row class="px-5 py-1">
                <v-col> {{ t('main.filters') }} </v-col>
            </v-row>
        </v-card-title>

        <v-card-text class="pt-0 pb-1">
            <v-row>
                <v-col>
                    <v-form ref="form" @submit.prevent="execAction">
                        <v-container>
                            <slot />

                            <v-row justify="end">
                                <v-col cols="4" md="2" lg="2" xl="1">
                                    <SecondaryButton
                                        :disabled="props.disabled"
                                        @click="$emit('clear')"
                                    >
                                        {{ clearButtonText }}
                                    </SecondaryButton>
                                </v-col>
                                <v-col cols="8" md="3" lg="3" xl="2">
                                    <PrimaryButton
                                        :disabled="props.disabled"
                                        type="submit"
                                    >
                                        {{ searchButtonText }}
                                    </PrimaryButton>
                                </v-col>
                            </v-row>
                        </v-container>
                    </v-form>
                </v-col>
            </v-row>
        </v-card-text>
    </v-card>
</template>

What is expected?

npm run build show build my project.

What is actually happening?

It throws ts#4058 on vue-tsc --noEmit step.

Link to minimal reproduction

No response

Any additional comments?

No response

[wudexiong]

The same error was encountered, typecript^5.6.2, vue-tsc^2.1.6, vuetify^3.7.2 The error is as follows:

Return type of exported function has or is using name 'StrategyProps' from external module "node_modules/vuetify/lib/components/index" but cannot be named.

According to the prompt, the StrategyProps interface is not exported, so it needs to be exported. I found the StrategyProps interface by modifying node_modules/vuetify/lib/components/index.d.mts and exported it through export As follows:

export interface StrategyProps {
    locationStrategy: keyof typeof locationStrategies | LocationStrategyFn;
    location: Anchor;
    origin: Anchor | 'auto' | 'overlap';
    offset?: number | string | number[];
    maxHeight?: number | string;
    maxWidth?: number | string;
    minHeight?: number | string;
    minWidth?: number | string;
}

The 'ts' configuration attempt is invalid. I can only modify its type file and patch it. I don't know if there is any other way to solve this problem, but I can only do this at present.

[NathanAP]

I'll close this one because I got an answer from Vuetify team in the original post.