Vue + Quasar: '#q-app/wrappers' Fehler beheben
Dieser Artikel wurde mit KI-Unterstützung aus dem koreanischen Original übersetzt. Das koreanische Original lesen →
 |
| Aaaarghhh |
Wahrscheinlich taucht bei dir dieser Fehler auf, oder der darunter:
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: No "exports" Oder:
ERROR(vue-tsc) Cannot find module '#q-app/wrappers' or its corresponding type declarations.- vue 3.4.18
- quasar 2.16.0
- quasar/app-vite 2.1.4
Ich weiß nicht genau, wann Quasar die Syntax geändert hat, aber in meiner aktuellen Version ist es anders als früher. Besonders wenn man das CLI zusammen mit Vite nutzt, wird man unweigerlich auf dieses Problem stoßen. Referenz
import { defineConfig } from "@quasar/app-vite";Das war die alte Methode. Jetzt muss man es so machen:
import { defineConfig } from '#q-app/wrappers'Dabei entsteht der Fehler, dass #q-app nicht importiert werden kann. Wenn man ChatGPT oder Cursor.ai fragt, raten sie einem, den node_modules-Ordner komplett zu löschen und npm install neu auszuführen, quasar clean --qconf zu probieren oder einfach die alte Import-Methode zu nutzen. Da die Änderung noch recht neu ist, haben die KIs das wohl noch nicht gelernt.
Das eigentliche Problem ist ein Bug. Es gibt zwar einen Patch, aber der wirkt eher wie ein Workaround als eine perfekte Lösung.
Wenn in der tsconfig.json der Wert baseUrl definiert ist, kommt es zu einem Konflikt mit der tsconfig.json, die Quasar selbst erstellt und verwendet (Quasar nutzt /.quasar/tsconfig.json, was unter dem extends-Schlüssel definiert ist).
Die Lösung
Lösche die Einträge baseUrl und path aus deiner tsconfig.json.
Hier ist eine empfohlene tsconfig.json-Datei:
{
"extends": "./.quasar/tsconfig.json",
"compilerOptions": {
"esModuleInterop": true,
"skipLibCheck": true,
"target": "esnext",
"allowJs": true,
"resolveJsonModule": true,
"moduleDetection": "force",
"isolatedModules": true,
"module": "preserve",
"noEmit": true,
"lib": [
"esnext",
"dom",
"dom.iterable"
]
},In der vite.config.js gibt es übrigens ähnliche Einstellungen. Diese kannst du aber ignorieren, da es sich um Alias-Pfade für Vite handelt. Der Konflikt tritt ausschließlich bei der tsconfig auf.