微前端 qiankun + vue 从 0 到 1

一、创建项目

1、新建一个文件夹（demo）

2、创建主项目（master）

$ vue create master
$ cd master
$ vue add vue-cli-plugin-qiankun --type master

3、创建子项目（foo-app）--- 跟主项目在同一级

$ vue create foo-app
$ cd foo-app
$ vue add vue-cli-plugin-qiankun --type slave --port 8081

4、查看配置主应用是否有错

master/src/App.vue

5、运行各项目

$ cd foo-app
$ yarn serve

image.png

$ cd master
$ yarn serve

image.png

至此，qiankun + vue 项目简易框架已搭建完成。