typescript ngrx type mismatch between (string|number)[] and string[]|number[]

Question

I am trying to upgrade my angular app to 5.2.10 with other following libraries: ngrx 5.2.0 typescript: 2.6.2 tslint 5.10.0

and hitting following errors during angular compilation:

`

ERROR in src/app/**/xxx-state.ts(301,5): error TS2322: Type '(string | number)[]' is not assignable to type 'string[] | number[]'.
  Type '(string | number)[]' is not assignable to type 'number[]'.
    Type 'string | number' is not assignable to type 'number'.
      Type 'string' is not assignable to type 'number'.
src/app/***/xxx-state.ts(305,5): error TS2322: Type '(string | number)[]' is not assignable to type 'string[] | number[]'.
  Type '(string | number)[]' is not assignable to type 'number[]'.

`

`

error TS2349: Cannot invoke an expression whose type lacks a call signature. Type '((searchElement: string, fromIndex?: number) => number) | ((searchElement: number, fromIndex?: nu...' has no compatible call signatures.

`

I am using @ngrx/entity library to derive our data state interfaces from following EntityState interface defined in 'module.d.ts' file of ngrx.

`

export interface EntityState<T> {
    ids: string[] | number[];
    entities: Dictionary<T>;
}

`

any pointers to resolve these errors?

Answer 1

(string|number)[] is an array that can contain string or number elements

string[] | number[] is EITHER an array of strings OR an array of numbers.

First would allow arrays like [1, "2", 3], second would not allow them. Thus the compiler complains, for your safety. Solution: use only one of the two.