问题标签 [single-spa-angular]

问问题

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

56 问题
Newest
Active
Bountied
318
Unanswered
0 投票
0 回答
82 浏览

angular - Primeng Checkbox.css 未正确加载

我正在将 Primeng 与 Single SPA Angular 应用程序一起使用。我正在使用 import { CheckboxModule } from 'primeng/checkbox'; 并导入到导入部分。我还使用了primeng 的ButtonModule 和Inputtextmodule，我可以在我的应用程序中正确使用ButtonModule 和Inputtextmodule 组件。但是在使用复选框时，它会在控制台中出现错误“应用程序'登录'在状态 SKIP_BECAUSE_BROKEN 中死亡：“无法加载 checkbox.css”

我试图分析这个问题，发现在 main.js 文件中它使用的是 styleUrls: ['./checkbox.css']，只有在复选框的情况下。对于 Button 和 InputText，它没有使用 styleUrls。在 angular.json 我使用了以下样式：

styles.scss 包含以下代码：

app.module.ts 文件包含如下导入语句：

来自 package.json 的依赖项：

},

谢谢

0 投票
0 回答
16 浏览

typescript - 无法将断言文件夹中的自定义图标设置为微前端中的 p-menuitem-icon？

我正在尝试将自定义图标从 css 设置为 p-menuitem 图标，但无法获取它。

我在 scss 文件中编写的代码

在打字稿中

如果我尝试在 p-menuitem-icon 中添加 icon-addmember 它不起作用？

请任何帮助或建议都会非常有帮助...在此先感谢。

0 投票
2 回答
318 浏览

angular - 单水疗微前端角度应用程序中的 URL 路由散列

我正在尝试使用单水疗库将我的应用程序实现为微前端。应用程序的文件夹结构如下，

  • 微前端
    • 根应用
    • 导航栏应用程序（Angular 应用程序）
    • 仪表板应用程序（Angular 应用程序）
    • 服务应用程序（Angular 应用程序）

我已经在服务器中部署了相同的内容，并且网站按预期工作。服务器中的文件夹结构（/var/www/html/）如下，

  • 家（根）[网址：https://microfrontendapp.com/home]
  • 仪表板 [网址：https://microfrontendapp.com/dashboard/my-dashboard]
  • 服务 [网址：https://microfrontendapp.com/service]
  • 导航栏

我面临的问题是我从主页开始使用该网站，然后移至仪表板或服务应用程序，如果我尝试从此 URL 路径重新加载，我会收到404 Page not found error for the web URL。

我正在尝试使用路由散列来解决问题。代码如下：

主页（根）应用程序

索引.html

根应用程序.js

导航栏应用

仪表板应用程序

路由器.ts

本地服务器 URL 行为如下，

  1. 主页：http://localhost:4200/#/
  2. 导航到仪表板：http://localhost:4200/#/dashboard/my-dashboard
  3. 在上面的 URL 上重新加载时，它工作得很好。

当部署在 apache 服务器中时，行为如下，

  1. 主页：https ://microfrontendapp.com/home
  2. 导航到仪表板：https ://microfrontend.com/home/#/dashboard/my-dashboard 。但是页面没有加载。没有 HTTP 调用来获取主脚本文件（仪表板应用程序编译的脚本文件）来加载页面。

有人可以帮助解释为什么脚本文件的 HTTP 调用没有启动吗？我不确定我是否做错了什么。或者有没有其他解决方案可以解决404 Page not found 问题

请在这里帮助我。提前致谢。

0 投票
0 回答
88 浏览

angular - 在单个 spa 微前端中调用错误的资产 URL

我正在使用 single-spa 库来实现微前端功能。

我正在使用资产在页面中显示。但是为获取资产而生成的 URL 是错误的。

例如，我在自助服务应用程序中使用了 information.svg 图标，则 URL 应为“https://customer.tcm.com/self-service/assets/information.svg”。但是正在获取的 URL 是 'https://customer.tcm.com/root/assets/information.svg' 或 'https://customer.tcm.com/assets/information.svg' 这显然会返回 404 响应.

有没有人之前遇到过这个问题？有人可以在这里帮我解决这个问题。

提前致谢。

0 投票
0 回答
18 浏览

single-spa - 如何在默认应用程序中加载默认组件，然后重定向到另一个子应用程序？

我有 3 个应用程序：root-config (single-spa)、navbar-app (port 4201 angular 12) angular-app (port 4202 angular 12)

  1. 我的根配置应用程序（本地主机：9000）有 root-config.ts
  1. 我的 myNavbarApp 有app-routing.module.ts
  1. NavBarAppmenu.component.html包括以下内容：

并menu.component.ts 包括下一个：

import {getAppNames, navigateToUrl, getMountedApps} from "single-spa";

  1. 如何实现 myNavBarAppmenu.component 在登录后/或何时需要时在所有子应用程序中保持可见？

  2. 如何login.component在浏览器中从 root-config 应用程序加载 myNavBarApp 时默认实现（之后无需手动输入“/login”）

  3. 单个 spa 文档说：single-spa Layout Engine is optional at this time but is recommended if you foresee utilizing server side rendering..所以我没有服务器渲染...这就是为什么我不实现布局，并且想知道没有它怎么可能？

  4. 为什么总是返回getAppNames() 空getMountedApps()数组？

0 投票
0 回答
25 浏览

angularjs - 使用单个 spa 加载不同的 Angularjs 应用程序

我已经实现了 angular 9 的单水疗中心，并遵循以下链接 https://github.com/liuyiba/Single-spa-angular-cross-domain。它基于共存应用程序。我的需要是将一个角度应用程序注入另一个角度应用程序[容器应用程序]，并且两者都基于不同的域。

我有 2 个网站，例如 abc.com 和 xyz.com，并且想从 xyz.com 链接调用 abc.com。我使用 system.js 导入 abc.com，但它引发了 cors 错误，尽管我创建了 proxy.config 来避免 cors。


12345678910