PrimeNG 升级到 15.0.0 后“p-grid”样式不起作用

Question

目前我正在 Angular 15 中进行 Primeng 升级。

场景： 根据要求，我们正在将 Angular12 PrimeNG(harmony-ng-12.2.0) 项目与 PrimeNG((harmony-ng-15.0.0) 一起升级到 Angular 15。“harmony-ng 是用于此目的的模板项目”。 首先，我们将 Angular 从 12 升级到 15。之后我们将 PrimeNG 升级到以下版本。

“ "primeflex": "^3.2.1", "primeicons": "6.0.1", "primeng": "15.1.1", ” 根据文档，我们用 Harmony-ng-15.0.0 资产文件夹替换了本地资产文件夹（SCSS、主题）。应用程序功能明智地工作正常。

问题： 主题受到干扰，主要是“p-grid，p-col”相关的 scss 样式不适用于模板。在节点模块中，我可以看到“PrimeFlex”，但样式不适用于组件。

我们在 angular.json 和 styles.scss 文件中添加了“primeflex.scss”引用，如下所示。但这些改变没有用。

在 angular.json 文件中

"styles": [
          "src/styles.scss",
          "node_modules/primeflex/primeflex.scss"
        ],

在Styles.scss文件中：

@import "../node_modules/primeng/resources/primeng.min.css";
@import "../node_modules/primeflex/primeflex.scss";
@import "../node_modules/primeicons/primeicons.css";

还尝试了以下链接中建议的更改。运气不好。 https://github.com/orgs/primefaces/discussions/130

需要帮助来解决此问题。

谢谢你。

Answer 1

请注意，从 primeflex 2.0.x 到 primeflex 3.0.x 版本，大多数类都丢失了

p-

素数前缀，所以：

• p 网格 > 网格
• p-col > col

等等。 最好查看官方文档相关类的新名称。 我们面临着类似的迁移，并且不得不重命名所有 primeflex 类。 还要仔细检查 primeflex.scss 是否与最新安装相关。