<p>Vue3 및 모듈 페더레이션을 사용하여 간단한 마이크로 프런트엔드 예제를 구축하려고 하는데 충돌 문제가 발생했습니다. </p>
<p>여기에 코드가 있습니다.
https://github.com/ghalex/mf-example</p>
<p>마이크로 프런트엔드는 두 개뿐입니다. </p>
- 컨테이너(Vue3)
- 인증(Vue3)
</ul>
<p>내 문제는 App.vue 구성 요소를 가져올 때 다음과 같은 문제가 발생한다는 것입니다. </p>
<pre class="brush:js;toolbar:false;">// index.js - 컨테이너 내
'./comComponents/App.vue'에서 앱 가져오기
</pre>
<pre class="brush:js;toolbar:false;">// indexAuth.js - 인증 중
'./comComponents/App.vue'에서 앱 가져오기
</pre>
<p><strong>auth</strong>모듈의 컨테이너에 모듈을 로드할 때 App.vue 구성 요소를 덮어썼습니다. </p>
<p>각 구성요소가 개별적으로 로드되도록 하기 위해 누락된 웹팩 설정이 있습니까? </p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
문제를 발견했습니다.
webpack-dev-serverv4의 버그입니다. v3으로 다운그레이드했는데 모든 것이 잘 작동합니다.