AgGrid ^31.2.0 Enterprise与Community版本TypeScript类型冲突问题

问题背景 #

正在搭建一个使用AgGrid React库+Enterprise库的新项目，已安装ag-grid-react、ag-grid-community、ag-grid-enterprise的^31.2.0版本。尽管已确保三者版本一致，且删除了yarn.lock文件重新安装，但仍出现奇怪的TypeScript类型冲突问题：导出列定义并在AgGridReact组件中使用时，TypeScript会标记列定义不兼容；但将相同定义直接复制到组件属性中则可正常运行。

代码示例 #

ClientAgGrid组件 #

export interface ClientDataGridParams extends AgGridReactProps<Client> {
}

export const ClientDataGrid = (params?: ClientDataGridParams) => {
  const [trigger] = ClientsApi.useLazyReadClientsQuery(); // RTK Query

  return (
    <AgGridReact<Client>
      rowModelType="clientSide"

      columnDefs={ClientColumnDefs}

      {...params}
    />
  )
}

列定义 #

export const ClientColumnDefs: ColDef<Client>[] = [
  {
    headerName: "#",
    sortable: false,
    filter: false,
    floatingFilter: false,
    cellRenderer: RowNumberCellRenderer,
    width: 75,
    pinned: 'left'
  },
  {
    field: 'id',
    hide: true,
    filter: 'text'
  },
  {
    field: 'origin',
    filter: 'text',
  },
  {
    field: 'createdAt',
    headerName: 'Created At',
    filter: 'date',
    cellRenderer: DateTimeCellRenderer
  },
  {
    field: 'updatedAt',
    headerName: 'Updated At',
    filter: 'date',
    cellRenderer: DateTimeCellRenderer
  }
];

export default ClientColumnDefs;

编译错误信息 #

TS2322: Type 'ColDef<Client, any>[]' is not assignable to type '(ColDef<Client, any> | ColGroupDef<Client>)[]'.
  Type 'ColDef<Client, any>' is not assignable to type 'ColDef<Client, any> | ColGroupDef<Client>'.
    Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/colDef").ColDef<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/colDef").ColDef<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>'.
      Types of property 'valueGetter' are incompatible.
        Type 'string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/colDef").ValueGetterFunc<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any> | undefined' is not assignable to type 'string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/colDef").ValueGetterFunc<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any> | undefined'.
          Type 'ValueGetterFunc<Client, any>' is not assignable to type 'string | ValueGetterFunc<Client, any> | undefined'.
            Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/colDef").ValueGetterFunc<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/colDef").ValueGetterFunc<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>'.
              Types of parameters 'params' and 'params' are incompatible.
                Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/colDef").ValueGetterParams<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/colDef").ValueGetterParams<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client, any>'.
                  Types of property 'node' are incompatible.
                    Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/interfaces/iRowNode").IRowNode<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client> | null' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/interfaces/iRowNode").IRowNode<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client> | null'.
                      Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/interfaces/iRowNode").IRowNode<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client>' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/interfaces/iRowNode").IRowNode<import("/home/rwilliams/repos/fifthsun/sentinel/src/api/mauthra/admin/Clients/common").Client>'.
                        Types of property 'setDataValue' are incompatible.
                          Type '(colKey: string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/column").Column<any>, newValue: any, eventSource?: string | undefined) => boolean' is not assignable to type '(colKey: string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/column").Column<any>, newValue: any, eventSource?: string | undefined) => boolean'.
                            Types of parameters 'colKey' and 'colKey' are incompatible.
                              Type 'string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/column").Column<any>' is not assignable to type 'string | import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/column").Column<any>'.
                                Type 'Column<any>' is not assignable to type 'string | Column<any>'.
                                  Type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-enterprise/dist/types/core/entities/column").Column<any>' is not assignable to type 'import("/home/rwilliams/repos/fifthsun/sentinel/node_modules/ag-grid-community/dist/types/core/entities/column").Column<any>'.
                                    Types have separate declarations of a private property 'gridOptionsService'.

补充测试结果 #

测试了几个近期版本，v31.1.0同样存在问题，但v31.1.1可正常使用。官方需要加强版本发布的质量控制。

内容的提问来源于stack exchange，提问作者Ryan Pierce Williams