Vue-Router.MJS-Konflikt trat nach dem VUE3-Projekt ein, das öffentliche Module eingeführt hat: Wie kann man das Problem des Userouters () nicht definiert?

VUE3-Projekt: Lösungen für die Einführung öffentlicher Module, die zu Vue-Router-Konflikten und Userouter () zurückkehren und undefined zurückkehren

Dieser Artikel analysiert und löst das Problem der useRouter() im VUE3-Projekt nach der Einführung öffentlicher Module und undefined zurückgeführt werden, und das Debuggen zeigt, dass ein Konflikt zwischen zwei vue-router.mjs Dateien besteht.

Problembeschreibung: Das Systemverwaltungsmodul (System) hängt vom gemeinsamen Modul (gemeinsam) ab, das Routing -Konfiguration (Route.js) und Vue -Router -Referenzen enthält. Nachdem das gemeinsame Modul im Intranet Nexus veröffentlicht wurde, gibt useRouter() undefined , nachdem das Systemmodul in das gemeinsame Modul eingeführt wurde. Das Debugging zeigt, dass das Projekt zwei vue-router.mjs Dateien enthält. Unter Verwendung von yarn link @ht/common um ein gemeinsames Modul einzuführen, verschwindet das Problem.

Die Hauptursache des Problems: Sowohl das gemeinsame Modul als auch das Systemmodul stützen sich auf Vue-Router. Da das gemeinsame Modul im Intranet Nexus in Form eines NPM-Pakets veröffentlicht wird, wird das Systemmodul über NPM installiert, was zu zwei im Projekt installierten Vue-Router-Versionen führt und Konflikte verursacht. yarn link erstellt symbolische Links und vermeidet doppelte Installationen.

Lösung: Stellen Sie sicher, dass das Projekt nur eine Version von Vue-Router verwendet. Die folgenden Methoden sind verfügbar:

1. Versionskonsistenz: Überprüfen Sie package.json von Common- und System-Modulen, um sicherzustellen, dass die Vue-Router-Version konsistent ist. Die Version ist inkonsistent, daher müssen Sie die Vue-Router-Version eines der Module anpassen.

2. Abhängigkeitsverbesserung: Entfernen Sie den Vue-Router aus dependencies des gemeinsamen Moduls und deklarieren Sie es direkt in dependencies des Systemmoduls. Das Systemmodul installiert Vue-Router direkt aus dem Projekt Root-Verzeichnis, um Versionskonflikte zu vermeiden. Die Routing-Konfiguration des gemeinsamen Moduls muss entsprechend angepasst werden, damit es nicht mehr direkt vom Vue-Router abhängt.

3. Modulstrukturoptimierung: Bewerten Sie das gemeinsame Moduldesign neu. Wenn das gemeinsame Modul nur gängige Komponenten und Werkzeugfunktionen bietet, sollte die Routing -Konfiguration nicht enthalten sein. Die Routing-Konfiguration sollte im Systemmodul oder in einem höheren Routing-Konfigurationsmodul platziert werden.

Durch die obige Methode kann der Vue-Router-Versionskonflikt effektiv vermieden werden und das Problem der useRouter() die undefined zurückkehren. Der Kern besteht darin, sicherzustellen, dass nur eine Version von Vue-Router im Projekt geladen und korrekt verwendet wird.

Das obige ist der detaillierte Inhalt vonVue-Router.MJS-Konflikt trat nach dem VUE3-Projekt ein, das öffentliche Module eingeführt hat: Wie kann man das Problem des Userouters () nicht definiert?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!