vite-plugin-federation踩坑

前言

项目即将用到vite-plugin-federation，开始参照网上的教程和vite-plugin-federation的官方文档试验最简单的微前端。
这里主要参照 VUEShenzhen 在 掘金和 知乎 上的文章去实现
下面是我照以上文章所作的尝试

一、准备工作

1、项目搭建

搭建两个vite项目
在自己的项目目录下打开cmd执行npm create vite@latest 分别创建vite-host 和vite-remote两个项目，目标是vite-remote

进入项目，并执行npm install 和 npm i @originjs/vite-plugin-federation

成功后执行npm run dev，项目正常运行并打开http://localhost:3000/和http://localhost:3001页面显示正常

2、远程端（vite-remote1）文件修改

将远程端的vite-remote的HelloWorld.vue的内容拆分成几个组件，在加上文章中的Button.js（不在项目中引用）的内容

Button.vue

HelloWorld.vue

RedButton.js

import