Estoy intentando actualizar un proyecto de Vue 2 a Vue 3 usando la compilación de migración y vite ( https://v3.vuejs.org/guide/migration/migration-build.html#overview )

Realicé los pasos 1 a 4 (aunque omití 4, ya que no usé mecanografiado). En este punto, me sale el siguiente error:

 src/main.js:3:16: error: No loader is configured for ".vue" files: src/App.vue

A pesar del mensaje, el problema parece estar relacionado con el alias @, porque si cambio import App from '@/App.vue'; para import App from './App.vue'; en main.js funciona bien. ¿Algunas ideas? También he intentado cambiar el alias a /src/ .

Por un lado, eso parece una solución fácil, pero por otro lado, hay un montón de otras importaciones a lo largo del proyecto que tendrían que reescribirse.

principal.js:

 import Vue from 'vue'; import App from '@/App.vue'; Vue.config.productionTip = false; let app = new Vue({ render: h => h(App) }).$mount('#app');

vite.config.js

 import { defineConfig } from 'vite'; import createVuePlugin from '@vitejs/plugin-vue'; import path from 'path'; export default defineConfig({ plugins: [ createVuePlugin({ template: { compilerOptions: { compatConfig: { MODE: 2 } } } }), ], resolve: { alias: { '@/': path.resolve(__dirname, './src/'), 'vue': '@vue/compat', }, }, });

paquete.json

 { "name": "xxx", "version": "0.1.0", "dependencies": { "@vue/compat": "^3.1.0", "vue": "^3.1.0" }, "devDependencies": { "@vitejs/plugin-vue": "^1.2.2", "@vue/compiler-sfc": "^3.1.0", "vite": "^2.4.1" } }

No pude ejecutar una reproducción en codesandbox (no parece que le gusten las declaraciones de alias en vite.config.js en absoluto). Pero este repositorio muestra el comportamiento: https://github.com/dovrosenberg/vite-vue-alias-issue

El error cambia a veces (sin motivo aparente para mí) cuando uso este repositorio a: Internal server error: Failed to resolve import "@/App.vue" from "src/main.js". Does the file exist?'