同时使用两个 UI 库？角

Question

有人成功地将 PrimeNG 模板集成到不同的框架中吗？ 我正在使用 Infragistics 构建一个大型项目，并且希望集成 PrimeNG Apollo 模板。然而，我面临着一些挑战，特别是风格冲突，并且尝试合并 PrimeNG 菜单组件完全不成功。这种整合总体上可行吗？

另一种选择是慢慢将 Infragistic 组件改为 PrimeNG，这将非常耗时，然后完全删除 Infragistics，然后再集成 Apollo。

我尝试了通常的方法来集成模板，后来只集成了一个组件。 （摘自 PrimeNg 文档）Infragistics 和 PrimeNg 似乎互不相干。

Answer 1

我认为它没有理由不起作用，两者仍然是Angular库，因此使用多个库当然是可能的。
技术上什至可以混合使用框架（基于 Web 组件的框架可能最容易插入其他框架中），尽管有时会涉及到一些挑战，但我离题了。

回答问题：
至少对于 Ignite UI for Angular (Infragistics)，所有样式 CSS 变量都以

--ig

为前缀，并且所有 CSS 规则都以

igx-

为前缀的元素或类，并且默认情况下不应与其他库交互。
排版可以是全局的，但实际上取决于它的范围，因为它可以是并且也是可选的。
从我看来，对于具有

p-

/

pi-

前缀和图层的 PrimeNG 来说也是如此，除非有一些我不知道的全局样式。

Ignite UI for Angular 文档中实际上已经有混合库的示例：

• Bootstrap Theming 还使用

  @ng-bootstrap/ng-bootstrap

  中的组件。导航栏实际上使用了

  igxButton

  和

  ngbDropdown

  菜单等。
• 材质主题还使用

  @angular/material

  中的组件。同样，导航栏中的第二个按钮是

  igxButton

  ，但会触发

  mat-menu

虽然这些主题详细介绍了如何使用 Ignite 的主题引擎来设计两组组件的样式，以便将一个调色板作为单一事实来源，但这当然取决于特定的用例/需求。重点仍然是，如果需要，您可以混合库并自定义样式。