升级Angular14后出现overflow属性不可动画警告如何修复

Angular 14 新增动画构建阶段的可动画属性校验逻辑，会自动识别动画定义中无法产生过渡效果的CSS属性并输出警告。overflow不属于标准可动画CSS属性，Angular 14之前的版本会静默忽略这类无效动画配置，不会抛出提示。
未在自定义动画中配置相关属性时，警告均来自项目引入的第三方Angular组件库：控制台提示的rootItem、panelContent、submenu是菜单、折叠面板类组件的通用动画触发器名，为组件库旧版本动画配置误将overflow加入动画属性列表导致，升级Angular 14后新校验规则触发就会出现该提示。

按优先级选择对应方案处理：

• 升级第三方组件库到适配Angular 14的版本
  先定位三个动画触发器所属的依赖（常见为NG-ZORRO、PrimeNG、Angular Material等带菜单/面板组件的UI库），将依赖升级到官方标注兼容Angular 14的正式版本，这类版本已修正动画配置中的无效属性问题，升级后警告自动消除。
• 临时屏蔽警告（暂无法升级依赖时使用）
  短期无法升级依赖的情况下，可以在根模块配置动画模块全局参数，关闭非可动画属性的构建警告，参考代码：

import { BrowserAnimationsModule, ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';

@NgModule({
  imports: [
    BrowserAnimationsModule,
    // 其余已有模块导入
  ],
  providers: [
    {
      provide: ANIMATION_MODULE_TYPE,
      useValue: 'BrowserAnimations'
    }
  ]
})
export class AppModule { }

• 修正自有动画配置（排查到触发器为自定义代码时使用）
  如果确认三个动画触发器属于项目内自封装组件，直接打开对应动画定义文件，删除所有state()、style()、animate()配置块中的overflow属性即可。overflow本身不支持过渡效果，放在动画配置中无实际作用，将其挪到组件对应的普通CSS样式文件中设置即可。

内容的提问来源于stack exchange，提问作者Serhii Derkach