qiankun子应用静态资源404问题的一种有效解决方法（遇到了http请求静态文件404、css文件引用图片无法显示、svg图片转换成 base64无法显示等问题）

在使用 qiankun 构建微前端应用时，我们需要分别构建主应用和子应用，并且需要注意它们之间的文件路径配置问题。 对于主应用，我们可以像普通的 Vue/React 应用一样进行构建，使用 webpack 或者其他构建工具进行打包。 对于子应用，我们需要在构建时指定输出路径，以便主应用可以正确地加载子应用的资源文件。具体来说，我们需要在子应用的构建配置文件中进行如下配置： 1. 设置 publicPath：在 webpack 配置文件中，设置 output.publicPath，将其设置为子应用部署的路径。比如，如果子应用部署在 http://localhost:8080/subapp1，那么 publicPath 应该设置为 /subapp1/。 2. 配置 output.path：将构建生成的文件输出到指定目录中，比如 dist/subapp1 目录。 3. 配置 filename：设置构建后生成的文件名，比如 [name].[hash:8].js。 完成上述配置后，我们需要在主应用中进行如下配置： 1. 在主应用中添加子应用的配置信息，包括子应用的名称、入口文件、路由信息等。具体可以参考 qiankun 官方文档进行配置。 2. 在主应用中加载子应用的资源文件，可以使用如下代码： ``` import { loadMicroApp } from 'qiankun'; loadMicroApp({ name: 'subapp1', entry: '//localhost:8080/subapp1', container: '#subapp-container', activeRule: '/subapp1', }); ``` 其中，entry 指定子应用的入口路径，container 指定子应用渲染的容器，activeRule 指定子应用的激活规则。 需要注意的是，主应用和子应用的文件路径配置需要保持一致，否则子应用的资源文件可能无法正确加载。