vue-router.mjs 충돌은 Vue3 프로젝트가 공개 모듈을 도입 한 후 발생했습니다 : Userouter ()의 문제를 해결하는 방법을 해결하는 방법은 무엇입니까?

vue3 프로젝트 : Vue-Router Conflict 및 Userouter ()로 이어지는 공개 모듈의 도입 솔루션 ()은 정의되지 않은 반환

이 기사는 공개 모듈을 소개 한 후 VUE3 프로젝트에서 undefined 반환을 useRouter() 문제를 분석하고 해결하며 디버깅은 두 vue-router.mjs 파일 사이에 충돌이 있음을 보여줍니다.

문제 설명 : 시스템 관리 모듈 (시스템)은 라우팅 구성 (Route.js) 및 VUE 라우터 참조를 포함하는 공통 모듈 (공통)에 따라 다릅니다. 공통 모듈을 인트라넷 넥서스에 게시 한 후 시스템 모듈이 공통 모듈에 도입 된 후 useRouter() 는 undefined 반환합니다. 디버깅은 프로젝트에 두 개의 vue-router.mjs 파일이 있음을 보여줍니다. 그러나 yarn link @ht/common 사용하여 공통 모듈을 도입하면 문제가 사라집니다.

문제의 근본 원인 : 공통 모듈과 시스템 모듈은 모두 vue-router에 의존합니다. 공통 모듈은 NPM 패키지 형태로 인트라넷 넥서스에 게시되므로 시스템 모듈은 NPM을 통해 설치되어 프로젝트에 두 개의 VUE- 로터 버전이 설치되어 충돌이 발생합니다. yarn link 중복 설치를 피하고 기호 링크를 만듭니다.

솔루션 : 프로젝트가 하나의 버전의 vue-router 만 사용하십시오. 다음 방법을 사용할 수 있습니다.

1. 버전 일관성 : Vue-router 버전이 일관되도록 Common 및 System 모듈의 package.json 확인하십시오. 버전은 일관성이 없으므로 모듈 중 하나의 vue-router 버전을 조정해야합니다.

2. 종속성 향상 : 공통 모듈의 dependencies 에서 vue-router를 제거하고 시스템 모듈의 dependencies 에서 직접 선언합니다. 시스템 모듈은 버전 충돌을 피하기 위해 Project Root 디렉토리에서 vue-router를 직접 설치합니다. 공통 모듈의 라우팅 구성은 더 이상 Vue-Router에 직접 의존하지 않도록 그에 따라 조정해야합니다.

3. 모듈 구조 최적화 : 공통 모듈 설계를 재평가합니다. 공통 모듈이 공통 구성 요소 및 공구 기능 만 제공하는 경우 라우팅 구성을 포함하지 않아야합니다. 라우팅 구성은 시스템 모듈 또는 상위 레벨 라우팅 구성 모듈에 배치해야합니다.

위의 방법을 통해 vue-router 버전 충돌은 효과적으로 피할 수 있으며 useRouter() 의 문제는 undefined 반환입니다. 핵심은 프로젝트에서 Vue-router의 하나의 버전 만 올바르게로드되어 사용되도록하는 것입니다.

위 내용은 vue-router.mjs 충돌은 Vue3 프로젝트가 공개 모듈을 도입 한 후 발생했습니다 : Userouter ()의 문제를 해결하는 방법을 해결하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!