we are trying to get started with Basic out of box Angular web project. Please find current configuration.
npm version
Debugger attached.
{
imxweb: '9.0.3',
npm: '9.6.7',
node: '22.14.0',
acorn: '8.14.0',
ada: '2.9.2',
amaro: '0.3.0',
ares: '1.34.4',
brotli: '1.1.0',
cjs_module_lexer: '1.4.1',
cldr: '46.0',
icu: '76.1',
llhttp: '9.2.1',
modules: '127',
napi: '10',
nbytes: '0.1.1',
ncrypto: '0.0.1',
nghttp2: '1.64.0',
nghttp3: '1.6.0',
ngtcp2: '1.10.0',
openssl: '3.0.15+quic',
simdjson: '3.10.1',
simdutf: '6.0.3',
sqlite: '3.47.2',
tz: '2024b',
undici: '6.21.1',
unicode: '16.0',
uv: '1.49.2',
uvwasi: '0.0.21',
v8: '12.4.254.21-node.22',
zlib: '1.3.0.1-motley-82a5fec'
}
when tried build qbm project seeing many errors like this. Tried clearing node modules and clean npm install.
Compiling with Angular sources in Ivy partial compilation mode.
ERROR: projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.html:110:81 - error TS2339: Property 'ColumnName' does not exist on type 'DataModelGroupInfo'.
110 [attr.data-imx-identifier]="'dst-groupbymenuNested-'+ category?.property?.ColumnName">
~~~~~~~~~~
projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.ts:78:16
78 templateUrl: './data-source-toolbar.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataSourceToolbarComponent.
projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.html:113:85 - error TS2339: Property 'ColumnName' does not exist on type 'DataModelGroupInfo'.
113 [attr.data-imx-identifier]="'dst-groupbymenuNested-'+ category?.property?.ColumnName + getGroupColumnDisplay(group)">
~~~~~~~~~~
projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.ts:78:16
78 templateUrl: './data-source-toolbar.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataSourceToolbarComponent.
projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.html:120:77 - error TS2339: Property 'ColumnName' does not exist on type 'DataModelGroupInfo'.
120 [attr.data-imx-identifier]="'dst-groupbymenu-'+ category?.property?.ColumnName">
~~~~~~~~~~
projects/qbm/src/lib/data-source-toolbar/data-source-toolbar.component.ts:78:16
78 templateUrl: './data-source-toolbar.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataSourceToolbarComponent.
projects/qbm/src/lib/cdr/edit-multi-limited-value/edit-multi-limited-value.component.html:4:71 - error TS2739: Type 'FormArray' is missing the following properties from type 'FormGroup': registerControl, addControl, removeControl, contains
4 <div [ngClass]="control.errors?.['required'] ? 'mat-error' : ''" [formGroup]="control" class="imx-multi-value-container">
~~~~~~~~~
projects/qbm/src/lib/cdr/edit-multi-limited-value/edit-multi-limited-value.component.ts:43:16
43 templateUrl: './edit-multi-limited-value.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component EditMultiLimitedValueComponent.
projects/qbm/src/lib/cdr/edit-image/edit-image.component.html:1:112 - error TS2339: Property 'files' does not exist on type 'EventTarget'.
1 <input [hidden]="true" #file type="file" multiple="false" accept="image/png" (change)="emitFiles($event.target.files)"/>
~~~~~
projects/qbm/src/lib/cdr/edit-image/edit-image.component.ts:43:16
43 templateUrl: './edit-image.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component EditImageComponent.
projects/qbm/src/lib/data-table/data-table.component.html:20:80 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
20 <eui-icon icon="collapsedown" *ngIf="grouping?.Count > 0 && !groupData[getGroupKey(grouping)]?.isExpanded"></eui-icon>
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:21:54 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
21 <eui-icon icon="collapseup" *ngIf="groupData[getGroupKey(grouping)]?.isExpanded"></eui-icon>
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
m ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:25:56 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
25 [ngClass]="{ 'group-row-expanded': groupData[getGroupKey(grouping)]?.isExpanded }"
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:23:37 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
23 [@groupExpand]="groupData[getGroupKey(grouping)]?.isExpanded ? 'expanded' : 'collapsed'"
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:30:35 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
30 [settings]="groupData[getGroupKey(grouping)]?.settings"
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:32:64 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
32 (navigationStateChanged)="onNavigationStateChanged(getGroupKey(grouping), $event)"
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/data-table/data-table.component.html:41:65 - error TS2445: Property 'getGroupKey' is protected and only accessible within class 'DataTableComponent<T>' and its subclasses.
41 (selectionChanged)="selectionInGroupChanged($event, getGroupKey(grouping))"
~~~~~~~~~~~
projects/qbm/src/lib/data-table/data-table.component.ts:77:16
77 templateUrl: './data-table.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTableComponent.
projects/qbm/src/lib/date/date/time-picker/time-picker.component.html:2:52 - error TS2739: Type 'AbstractControl' is missing the following properties from type 'FormControl': defaultValue, registerOnChange, registerOnDisabledChange, _applyFormState
2 <eui-time-picker [allowTextInput]="true" size="s" [timeControl]="control" [minuteResolution]="5" (valueChange)="onValueChange($event)">
~~~~~~~~~~~
projects/qbm/src/lib/date/date/time-picker/time-picker.component.ts:36:16
36 templateUrl: './time-picker.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component TimePickerComponent.
projects/qbm/src/lib/image/image-select/image-select.component.html:4:22 - error TS2322: Type 'AbstractControl' is not assignable to type 'FormControl'.
4 <input matInput [formControl]="control" [hidden]="control?.value?.length > 0"
~~~~~~~~~~~
projects/qbm/src/lib/image/image-select/image-select.component.ts:35:16
35 templateUrl: './image-select.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component ImageSelectComponent.
projects/qbm/src/lib/data-tiles/data-tiles.component.html:11:34 - error TS2345: Argument of type '{ entity: TypedEntity; badge: DataTileBadge; }' is not assignable to parameter of type 'DataTileBadge'.
Type '{ entity: TypedEntity; badge: DataTileBadge; }' is missing the following properties from type 'DataTileBadge': content, color
11 (badgeClicked)="onBadgeClicked($event)"
~~~~~~
projects/qbm/src/lib/data-tiles/data-tiles.component.ts:42:16
42 templateUrl: './data-tiles.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component DataTilesComponent.
projects/qbm/src/lib/entity/entity-select/entity-select.component.html:2:60 - error TS2551: Property 'value' does not exist on type 'EuiSelectOption | EuiSelectOption[]'. Did you mean 'values'?
Property 'value' does not exist on type 'EuiSelectOption[]'.
2 <eui-select (selectionChange)="selectionChange.emit($event.value)" placeholder="{{ placeholder | translate }}"
~~~~~
projects/qbm/src/lib/entity/entity-select/entity-select.component.ts:35:16
35 templateUrl: './entity-select.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component EntitySelectComponent.
projects/qbm/src/lib/entity/typed-entity-select/typed-entity-selector/typed-entity-selector.component.html:8:59 - error TS2741: Property 'get' is missing in type 'TypedEntityFkData' but required in type 'FkCandidatesData'.
8 <imx-fk-candidates class="imx-fk-selector" #fkSelector [data]="fkRelationData" [selectedFkTable]="selectedFkTable"
~~~~
projects/qbm/src/lib/entity/typed-entity-select/typed-entity-selector/typed-entity-selector.component.ts:37:16
37 templateUrl: './typed-entity-selector.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component TypedEntitySelectorComponent.
projects/qbm/src/lib/entity/fk-table-select/fk-table-select.component.html:1:89 - error TS2551: Property 'value' does not exist on type 'EuiSelectOption | EuiSelectOption[]'. Did you mean 'values'?
Property 'value' does not exist on type 'EuiSelectOption[]'.
1 <eui-select *ngIf="options && !loading" (selectionChange)="selectionChanged.emit($event.value)"
~~~~~
projects/qbm/src/lib/entity/fk-table-select/fk-table-select.component.ts:36:16
36 templateUrl: './fk-table-select.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component FkTableSelectComponent.
projects/qbm/src/lib/menu/menu.component.html:4:166 - error NG8002: Can't bind to 'active' since it isn't a known property of 'button'.
4 <button mat-button class="imx-mein-menu-item" *ngIf="!item.items" (click)="navigate(item)" [attr.data-imx-identifier]="item.id" (keyup.enter)="navigate(item)" [active]="isActive(item)">
[0m ~~~~~~~~~~~~~~~~~~~~~~~~~
projects/qbm/src/lib/menu/menu.component.ts:39:16
39 templateUrl: './menu.component.html',
~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component MenuComponent.
projects/qbm/src/lib/sqlwizard/column-selection.component.html:3:51 - error TS2551: Property 'value' does not exist on type 'EuiSelectOption | EuiSelectOption[]'. Did you mean 'values'?
Property 'value' does not exist on type 'EuiSelectOption[]'.
3 (selectionChange)="selectionChange($event.value)" [hideClearButton]="true" [filterFunction]="filter"
~~~~~
projects/qbm/src/lib/sqlwizard/column-selection.component.ts:35:18
35 templateUrl: './column-selection.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component ColumnSelectionComponent.
Anyhelp is highly appreciated.