Le conflit Vue-Router.MJS s'est produit après que le projet VUE3 a introduit des modules publics: comment résoudre le problème de l'utilisateur () Retour non défini?

Vue3 Project: Solutions pour l'introduction de modules publics qui mènent au conflit Vue-Router et à userouter ()

Cet article analyse et résout le problème de useRouter() Retour undefined dans le projet Vue3 après l'introduction de modules publics, et le débogage montre qu'il existe un conflit entre deux fichiers vue-router.mjs .

Description du problème: Le module de gestion du système (système) dépend du module commun (commun), qui contient des références de configuration de routage (Route.js) et Vue. Après avoir publié le module commun au lien intranet, une fois le module système introduit dans le module commun, useRouter() renvoie undefined . Le débogage montre que le projet a deux fichiers vue-router.mjs . Cependant, en utilisant yarn link @ht/common pour introduire un module commun, le problème disparaît.

La cause profonde du problème: le module commun et le module système reposent sur Vue-Router. Étant donné que le module commun est publié dans le Nexus Intranet sous la forme d'un package NPM, le module système est installé via NPM, résultant en deux versions Vue-Router installées dans le projet, provoquant des conflits. yarn link crée des liens symboliques, en évitant les installations en double.

Solution: assurez-vous que le projet utilise une seule version de Vue-Router. Les méthodes suivantes sont disponibles:

1. Cohérence de la version: vérifiez package.json des modules communs et système pour vous assurer que la version Vue-Router est cohérente. La version est incohérente, vous devez donc ajuster la version Vue-Router de l'un des modules.

2. Amélioration de la dépendance: supprimez Vue-Router dependencies du module commun et déclarez-la directement dans dependencies du module système. Le module système installera Vue-Router directement à partir du répertoire racine du projet pour éviter les conflits de version. La configuration de routage du module commun doit être ajustée en conséquence afin qu'elle ne dépend plus directement de Vue-Router.

3. Optimisation de la structure du module: Réévaluez la conception du module commun. Si le module commun fournit uniquement des composants communs et des fonctions d'outil, la configuration de routage ne doit pas être incluse. La configuration de routage doit être placée dans le module système ou dans un module de configuration de routage de niveau supérieur.

Grâce à la méthode ci-dessus, le conflit de version Vue-Router peut être évité efficacement et le problème de useRouter() renvoyant undefined . Le noyau est de s'assurer qu'une seule version de Vue-Router dans le projet est chargée et utilisée correctement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!