Vue.js VITE：无法为VUE单文件组件加载URL

我有一个与维生素EBundle 在一起的VUE应用程序.在将依赖项作为VUE单文件组件加载时，我遇到了一个问题.一切都是按照标准的脚手架VITE示例进行的.

这是我的vite.config.js美元

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
  ],
  resolve: {
    alias: {
      // This SHOULD resolve my imports, but it seems to have a problem
      '@': fileURLToPath(new URL('./src', import.meta.url))    
    }
  }
})

以下是我try 导入依赖项的VUE router.js文件

import welcomeChat from "@/views/welcome-chat"   //<======= this throws an error

const router = createRouter({
 history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
        path: "/welcome",
        name: "welcome",
        component: welcomeChat
    }
})

npm run dev可以，但当我在浏览器中打开我的应用程序时，我会得到以下error

Failed to load url /src/views/welcome-chat (resolved id: /Users/doogie/Coding/liquido/liquido-mobile-pwa-vue3_3/src/views/welcome-chat) in /Users/doogie/Coding/liquido/liquido-mobile-pwa-vue3_3/src/services/router.js. Does the file exist?

第/Users/doogie/Coding/liquido/liquido-mobile-pwa-vue3_3/src/views/welcome-chat章确实存在使用.vue扩展名有问题吗？