问题标签 [single-spa]

在我的主要 index.html 文件中，我给出了以下几种路线。

加载路由“main”时，它有时只呈现一个微前端，无论是横幅还是页脚应用程序。有什么解决办法吗？

我正在使用单个 spa 创建微前端角度应用程序。如何从 assets 文件夹加载 i18n 文件。

我已按照以下说明进行操作： https ://single-spa.js.org/docs/ecosystem-angular/

角版本：9.1.12

单人水疗中心：4

单水疗角度：4.4.2

我们是否需要在 webpack 中添加一些额外的配置，以便它从 assets 文件夹中加载 i18n 文件？

我有在创建反应应用程序中开发的反应应用程序。

现在我正在使用单个 spa 集成微前端。

我已将 React 应用程序转换为单个 spa。工作正常。

问题 ：

我有另一个在 CRA 中开发的反应应用程序（创建反应应用程序）。这个应用程序也与 Single SPA 集成

示例代码：

请帮我修复。

是否可以列出所有“popstate”事件监听器？

当我尝试在同一页面上使用具有独立路由的多个单页面应用程序时，我正在解决微前端应用程序并遇到问题。所以我遇到的问题是当我与 App1 交互时，App2 路由的行为不正确，最好的例子是点击 App1 中的某个链接，强制 App2 使用它自己的路由，我在 App2 中收到 404 错误。

我尝试使用beforeEachVue 路由器的方法，但遇到历史推送回滚的问题。我试图从我的 App2 外部修改路由器对象，但它不起作用。

所以我的下一步是深入研究 popstate 事件并解决问题。mb 有人遇到这个问题，或者 mb 只是给我一个很好的建议。谢谢。

您好，我正在构建一个带有单水疗中心的微前端架构。在我的主应用程序（引导程序）中，我声明了我的片段、我的路由并注入了组件库（例如：元素 UI）和我的身份验证库（自定义）。

一切正常，显示和路由，但是：

1. 如何在片段中使用 elementUI 的组件？例子：

我已经尝试使用此代码（其中 component_name 是按钮或其他）

但是 Vue 不识别这个按钮。

2. 如何使用认证库的实用功能。例如恢复组件的访问权限？直接调用函数是不行的。

谢谢

我正在使用单水疗中心来创建我的应用程序。我在加载微前端app的时候，没有使用SystemJS，如下：

所以，我libraryTarget:'window' 在 app1 的 webpack 配置中使用。

当我使用 webpack4 时它工作正常。

但是当我将 webpack 更新到 webpack-5 时，似乎出现了问题，webpack 生成的输出代码无法为 window 对象设置正确的值。

webpack-4： 在 webpack-4 上运行良好

webpack-5： 对象中没有任何内容

这是 webpack-5 的问题吗？

我创建了一些应用程序，它们遵循与Single-spa 示例页面上列出的react-microfrontend项目相同的模式。但是，这些示例没有使用 TypeScript。

当 App2 尝试导入 App1 中存在的函数时，我收到 TS 错误，因为 App2 无法找到 App1 对象的类型。这对我来说很有意义，因为在root-config 项目的文件中importmap.json引用的只有一个为每个微前端的 .js 文件列出的 URL。我真的不想到处添加@ts-ignore 语句，我也不想在没有类型安全的情况下进行跨应用程序通信。index.html

我所指的一个例子：

Planets 应用程序中的这个文件引用了 Styleguide 应用程序中的 Button 组件。除非我在导入语句之前的行上放置一个@ts-ignore，否则我无法构建它，因为我的 Planets 应用程序找不到 Styleguide 的类型声明。

一般来说，我对导入地图和 SystemJS 非常陌生，所以如果有人能指出我正确的方向，我将不胜感激。实际上，我已经经历了将我的 Styleguide 构建为常规 npm 库并将其作为依赖项包含在 Planets package.json 文件中的麻烦……这首先违背了使用 Single-spa 的全部目的.

导入地图.json

page.component.ts

我正在使用此命令生成 angular 10 项目：

但是我注意到在生成 angular 10 项目后，app.component.ts 没有被使用。

console.log 命令永远不会被执行。这怎么可能发生？如果我使用 ng new 命令，这肯定会被执行。如果这是预期的，请告知。然后如何在单个水疗中心使用 angular 10？谢谢

这是默认组件：

添加到 entryComponents 是没用的，我想如果有人使用 npx create-single-spa 命令生成 ng 项目可以立即看到这个问题。

不知道这里有什么问题

似乎使用 npx create-single-spa 创建的 angular 项目只能在 single-spa 中加载，不能单独加载

我想知道我们是否可以在不使用 single-spa 的情况下单独启动和调试创建的 angular 项目，然后一旦完成，部署并让 single-spa 使用它

我一直在试验 single-spa 一段时间，并了解开发人员体验的基础知识。创建一个包裹，在唯一端口上启动纱线，添加对导入映射声明的引用，等等。挑战在于，随着我的根配置积累越来越多的模块，管理端口和导入映射开始变得乏味。我想要的是将这些模块发布到中央存储库并从那里加载它们（例如，http ://someserver.com/repository/moduleA/myorg-modulea.js等）。

我最近被介绍到 localstack 并开始考虑也许本地 S3 存储桶可以为此服务。我有一个配置，其中构建（纱线构建）会自动发布到在 localstack 上运行的 s3 存储桶。但是当我尝试从存储桶加载根配置 index.html 时，我收到以下 JS 错误：

我可以通过 curl 访问每个包裹的 JS 文件和 root-config，所以我想这对于以相同方式使用的任何 http 服务器都是一个问题。我可以翻转根配置以使用标准的 webpack-dev-server（在端口 9000 上），它工作正常。所以我猜测生产构建如何解决这些模块与本地构建之间存在差异。

有没有人尝试过这样的事情并让它工作？

当我将我的角度编译为：

包.json：