angular: @angular/core is not compatible with Typescript 2.4.1 when activating option strictNullChecks

@chuckjaz when it will be released?

Nice to know that it will be fixed in 5.x, but I would expect something like this would be included in a maintenance release for 4.x as well.

This still seems to be broken

@Delagen Try combining with "skipLibCheck": true.

https://github.com/angular/angular-cli/issues/6827 https://github.com/ReactiveX/rxjs/issues/2539

my tsconfig.json looks like this:

{ "compilerOptions": { "module": "es2015", "target": "es2015", "lib": [ "es2016", "dom" ], "skipLibCheck": true, "moduleResolution": "node", "noImplicitAny": false, "sourceMap": false, "emitDecoratorMetadata": true, "experimentalDecorators": true, "outDir": "./public/js/app" }, "exclude": [ "node_modules", "public/js", "assets/app/polyfills.ts" ], "angularCompilerOptions": { "skipMetadataEmit": true } }

Adding the “skipLibCheck”: true solved it for me

Hi Angular team, is it planned to be fixed soon please ?

I am using the following config today

• "@angular/core": "4.3.1"
• "typescript": "2.4.2"
• "compilerOptions": {"strict": true}

and the errors are still present when ng serve.

Changing manually node_modules/@angular/core/src/change_detection/differs/iterable_differs.d.ts by adding the 2 missing | null is still my workaround today, but I would like to know if you plan to work on this fix any time soon?

Thank you very much

I would recommend to stick with Typescript 2.3.4 instead while these 2 issues are not fixed (the current one + the rxjs one), instead of disabling the checks on the newer version 2.4.1 of TS.

This is because of typescripts stricter generic checks. A workaround is to disable it by adding "noStrictGenericChecks": true to your tsconfig.json.

Ummm, I’ll try upgrading Angular and see if that makes the problem go away. Thanks for pointing that out! I wish there is a compatibility table for TypeScript and Angular 😦

this is not perfect but if some of you need (as I do) to use the newer TS versions, you can combine .angular-cli.json’s typescriptMismatch and tsconfig.json’s skipLibCheck if you want the stricter type-checking in your code anyway.

Of course it’s not fixed 😃 There is an opened PR for this #18457, but still not approved yet.

still cause error on 4.3.4

@angular/cli: 1.3.0 node: 8.2.1 os: linux x64 @angular/animations: 4.3.4 @angular/common: 4.3.4 @angular/compiler: 4.3.4 @angular/core: 4.3.4 @angular/forms: 4.3.4 @angular/http: 4.3.4 @angular/platform-browser: 4.3.4 @angular/platform-browser-dynamic: 4.3.4 @angular/router: 4.3.4 @angular/cli: 1.3.0 @angular/compiler-cli: 4.3.4 @angular/language-service: 4.3.4

Class ‘DefaultIterableDifferFactory’ incorrectly implements interface ‘IterableDifferFactory’.

This is preventing us from using typescript 2.4.x. Any fixes in the pipeline?

Yes, this refers to a bug in @angular/core - it is NOT about the RxJs bug.

@djnaumov No. RxJs had the mismatched generics in lift. This one is another, but similar, error in angular core itself.

features of typescript 2.4 and webpack 2 make possible instead of using webpack loader for replacing this

{
path:         "path",
loadChildren: "./some.module#SomeModule"
}

write

{
path:         "path",
loadChildren: () => import("./some.module").then((module) => module.SomeModule)
}

or even

{
path:         "path",
loadChildren: () => import(/* webpackChunkName: "some-module" */"./some.module").then((module) => module.SomeModule)
}

if you want webpack chunk naming (removeComments option must be turned off) or even

{
path:         "path",
loadChildren: async () => (await import(/* webpackChunkName: "some-module" */"./some.module")).SomeModule
}

PS: but this need more work to support AOT, cause need to import NgFactory PSS: wrote small webpack chain loader to support then method )

Definitely! That’s why I was saying it might not work for everyone just yet 😃

@MarkPieszak The release of rxjs 5.4.2 only means that there are no more errors about rxjs when using Typescript 2.4.1. It does not mean that the issue with angular 4.2.5<->TS 2.4.1 is magically fixed! 😃

@MarkPieszak I upgraded RSJS to 5.4.2 but am still getting some build errors:

ERROR in /Users/saul/projects/passit-frontend/node_modules/@angular/core/src/change_detection/differs/default_iterable_differ.d.ts (2,22): Class 'DefaultIterableDifferFactory' incorrectly implements interface 'IterableDifferFactory'.
  Types of property 'create' are incompatible.
    Type '<V>(trackByFn?: TrackByFunction<V> | undefined) => DefaultIterableDiffer<V>' is not assignable to type '{ <V>(trackByFn?: TrackByFunction<V> | undefined): IterableDiffer<V>; <V>(_cdr?: ChangeDetectorRe...'.
      Type 'DefaultIterableDiffer<any>' is not assignable to type 'IterableDiffer<any>'.
        Types of property 'diff' are incompatible.
          Type '(collection: NgIterable<any>) => DefaultIterableDiffer<any> | null' is not assignable to type '(object: NgIterable<any>) => IterableChanges<any> | null'.
            Type 'DefaultIterableDiffer<any> | null' is not assignable to type 'IterableChanges<any> | null'.
              Type 'DefaultIterableDiffer<any>' is not assignable to type 'IterableChanges<any> | null'.
                Type 'DefaultIterableDiffer<any>' is not assignable to type 'IterableChanges<any>'.
                  Types of property 'forEachOperation' are incompatible.
                    Type '(fn: (item: IterableChangeRecord<any>, previousIndex: number | null, currentIndex: number | null)...' is not assignable to type '(fn: (record: IterableChangeRecord<any>, previousIndex: number, currentIndex: number) => void) =>...'.
                      Types of parameters 'fn' and 'fn' are incompatible.
                        Types of parameters 'previousIndex' and 'previousIndex' are incompatible.
                          Type 'number | null' is not assignable to type 'number'.
                            Type 'null' is not assignable to type 'number'.

ERROR in /Users/saul/projects/passit-frontend/node_modules/@angular/core/src/change_detection/differs/default_iterable_differ.d.ts (10,22): Class 'DefaultIterableDiffer<V>' incorrectly implements interface 'IterableChanges<V>'.
  Types of property 'forEachOperation' are incompatible.
    Type '(fn: (item: IterableChangeRecord<V>, previousIndex: number | null, currentIndex: number | null) =...' is not assignable to type '(fn: (record: IterableChangeRecord<V>, previousIndex: number, currentIndex: number) => void) => v...'.
      Types of parameters 'fn' and 'fn' are incompatible.
        Types of parameters 'previousIndex' and 'previousIndex' are incompatible.
          Type 'number | null' is not assignable to type 'number'.
            Type 'null' is not assignable to type 'number'.

ERROR in /Users/saul/projects/passit-frontend/node_modules/@angular/core/src/change_detection/differs/default_iterable_differ.d.ts (10,22): Class 'DefaultIterableDiffer<V>' incorrectly implements interface 'IterableDiffer<V>'.
  Types of property 'diff' are incompatible.
    Type '(collection: NgIterable<V>) => DefaultIterableDiffer<V> | null' is not assignable to type '(object: NgIterable<V>) => IterableChanges<V> | null'.
      Type 'DefaultIterableDiffer<V> | null' is not assignable to type 'IterableChanges<V> | null'.
        Type 'DefaultIterableDiffer<V>' is not assignable to type 'IterableChanges<V> | null'.
          Type 'DefaultIterableDiffer<V>' is not assignable to type 'IterableChanges<V>'.
            Types of property 'forEachOperation' are incompatible.
              Type '(fn: (item: IterableChangeRecord<V>, previousIndex: number | null, currentIndex: number | null) =...' is not assignable to type '(fn: (record: IterableChangeRecord<V>, previousIndex: number, currentIndex: number) => void) => v...'.
                Types of parameters 'fn' and 'fn' are incompatible.
                  Types of parameters 'previousIndex' and 'previousIndex' are incompatible.
                    Type 'number | null' is not assignable to type 'number'.
                      Type 'null' is not assignable to type 'number'.

At least from my testing, if you upgrade rxjs to 5.4.2 you should be able to run Angular with TS 2.4.

Just remember that you’re upgrading at your own risk as I don’t believe it has been fully tested &/or is supported at the moment.