Single-Spa 实践（上） -- 子应用在相同目录下

Single-Spa 实践（上） – 子应用在相同目录下

基于 single-spa 来搭建一个 react 的微前端应用，主应用以及子应用都在同一个个目录下，即下方的 micro-front 下

Step 1 新建一个目录，并初始化

mkdir mirco-front && cd micro-front
npm init -y

Step 2 增加 webpack 配置

怎么简单怎么来，因为后面我们是用的 react，并且是用 CRA 来创建的子应用，所以这个 webpack 的基本配置需要支持 react、svg、css等，入口文件对应的是我们下一步创建的 single-spa.config.js 文件

Step 3 增加 single-spa.config 文件

这个文件是我们微前端应用的根文件，是总的一个配置文件，文件配置看着官网的来就行，这里注册了 app1 和 app2，这两个都是用 CRA 创建的

import * as singleSpa from "single-spa";

singleSpa.registerApplication(
    "app1",
    (<