Vite创建vue3项目路径问题

1.使用相对路径引入.vue文件出现“无法找到路径”

            path: '/',
            name: 'index',
            component: () => import('@/components/Home/index.vue')

没有配置引入文件的方法，无法识别.vue文件

在vite-env.d.ts文件中 设置：

declare module "*.vue" {
    import type { DefineComponent } from "vue";
    const component: DefineComponent<{}, {}, any>;
    export default component;
}

可解决！！！

2.在此基础上使用@设置快捷地址操作

1. npm install path;npm install url 
2. vite.config.ts

   import { defineConfig } from 'vite'
   import vue from '@vitejs/plugin-vue'
   import path from 'path'
   import { fileURLToPath } from 'url'
   // https://vitejs.dev/config/
   const __filenameNew = fileURLToPath(import.meta.url)
   const __dirnameNew = path.dirname(__filenameNew)
   export default defineConfig({
     plugins: [vue()],
     resolve: {
         alias: {
         "@": path.resolve(__dirnameNew, './src')
         }
       }
   })
   

3. tsconfig.json

       "baseUrl": "./",
       "paths": {
         "@/*": [
           "src/*"
         ]
       },