tsconfig.base.json does not exist after upgrade to Angular 10 (no error)

[tachojelev]

Description

Hello guys, I am working on on upgrading a couple of projects to Angular 10 from Angular 9 and I am going through the steps in the update.angular.io guide, however I am having an issue with one of the projects. (I am using ng update)

The first project was upgraded successfully by upgrading to the latest Angular 8 version first, then upgrading to Angular 9 and then to Angular 10.
The upgrade of the second project however seemed incomplete, because not all of the same migrations were executed as for the first one.

I am aware of this #18027, however I have not received any errors and I updated the project step by step without skipping major versions.

Update log

After executing ng update @angular/core @angular/cli, the following output was present:

The installed local Angular CLI version is older than the latest stable version.
Installing a temporary version to perform the update.
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Using package manager: 'npm'
Collecting installed dependencies...
Found 44 dependencies.
Fetching dependency metadata from registry...
                      Package "@angular-devkit/build-ng-packagr" has an incompatible peer dependency to "tsickle" (requires "~0.38.0", would install "0.39.0")
                       Package "@angular/cdk" has an incompatible peer dependency to "tslib" (requires "^1.9.0", would install "2.0.0").
                       Package "tsickle" has an incompatible peer dependency to "typescript" (requires "~3.8.2", would install "3.9.6")

Since tsickle does not have typescript 3.9.x as a peer dependency yet (should be resolved by this issue I guess: angular/tsickle#1161 ), I ignored that warning. I ignored the angular/cdk warning as well, because upgrading the angular/material package (after the core and cli packages) should update the cdk to version 10 as well. Eventually I executed the ng update with the --force flag.

This is the final output, in which you will notice that only the package.json file is updated and the additional migrations to the tsconfig.json, tsconfig.lib.prod.json and the creation of the tsconfig.base.json are missing, but no error is thrown.

ng update @angular/core @angular/cli --force
The installed local Angular CLI version is older than the latest stable version.
Installing a temporary version to perform the update.
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Using package manager: 'npm'
Collecting installed dependencies...
Found 44 dependencies.
Fetching dependency metadata from registry...
                      Package "@angular-devkit/build-ng-packagr" has an incompatible peer dependency to "tsickle" (requires "~0.38.0", would install "0.39.0")
                       Package "@angular/cdk" has an incompatible peer dependency to "tslib" (requires "^1.9.0", would install "2.0.0").
                       Package "tsickle" has an incompatible peer dependency to "typescript" (requires "~3.8.2", would install "3.9.6")
    Updating package.json with dependency @angular/cli @ "10.0.1" (was "9.1.10")...
    Updating package.json with dependency @angular/core @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular-devkit/build-ng-packagr @ "0.1000.1" (was "0.901.10")...
    Updating package.json with dependency ng-packagr @ "10.0.0" (was "9.1.5")...
    Updating package.json with dependency @angular/language-service @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/compiler-cli @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/common @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/animations @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/elements @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/platform-browser @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/platform-browser-dynamic @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/compiler @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular/forms @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency tslib @ "2.0.0" (was "1.10.0")...
    Updating package.json with dependency @angular/router @ "10.0.2" (was "9.1.11")...
    Updating package.json with dependency @angular-devkit/build-angular @ "0.1000.1" (was "0.901.10")...
    Updating package.json with dependency typescript @ "3.9.6" (was "3.8.3")...
UPDATE package.json (2870 bytes)
✔ Packages installed successfully.
** Executing migrations of package '@angular/core' **

❯ Missing @Injectable and incomplete provider definition migration.
  As of Angular 9, enforcement of @Injectable decorators for DI is a bit stricter and incomplete provider definitions behave differently.
  Read more about this here: https://v9.angular.io/guide/migration-injectable
  Migration completed.

❯ ModuleWithProviders migration.
  As of Angular 10, the ModuleWithProviders type requires a generic.
  This migration adds the generic where it is missing.
  Read more about this here: https://v10.angular.io/guide/migration-module-with-providers
  Migration completed.

❯ Undecorated classes with Angular features migration.
  In version 10, classes that use Angular features and do not have an Angular decorator are no longer supported.

Issue

The end result is a very short upgrade log and it seems not everything was migrated, which includes the missing tsconfig.base.json. What could be the reason for that and is it essential for all Angular 10+ projects to have the new structure, that these tsconfig migrations provide? The project builds and runs successfully though.

[alan-agius4]

Hi @tachojelev,

Thanks for the report.

Firstly, in many cases tsickle is unneeded outside of Google unless you are using closure compiler. Thus, likely you should remove it from your dev dependencies.

I suggest that you to re-run the migrations by using the below:

ng update @angular/cli --migrate-only --from 9 --to 10
ng update @angular/core --migrate-only --from 9 --to 10

Let's me know, how it goes.

[DmitryEfimenko]

I also noticed that tsconfig.base.json didn't get created after the migration. I've done the migration on the open-source project. So, in theory, one could reproduce the issue: https://github.com/openpassphrase/opp-web

Update:
Running ng update @angular/core --migrate-only --from 9 --to 10 created the file.

Not sure if there's anything that could be done to smooth out the experience.

[SnorreDanielsen]

I also followed the steps at the update.angular.io guide to go from Angular 9.1 to 10. The update finished without any errors, but no tsconfig.base.json was created.

I tried to follow @alan-agius4 advice and ran:

ng update @angular/cli --migrate-only --from 9 --to 10

It gave me the folloving error:

> Add "Solution Style" TypeScript configuration file support.
  This improves developer experience using editors powered by TypeScript’s language server.
  Read more about this here: https://v10.angular.io/guide/migration-solution-style-tsconfig
× Migration failed: Invalid JSON AST Object (AnalysisWarning.json)
  See "C:\Users\fursdn\AppData\Local\Temp\ng-s0ved0\angular-errors.log" for further details.

The error file contains the following:

[error] Error: Invalid JSON AST Object (AnalysisWarning.json)
at visitExtendedJsonFiles (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:36:19)
at visitExtendedJsonFiles.next ()
at visitExtendedJsonFiles (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:52:16)
at visitExtendedJsonFiles.next ()
at visitExtendedJsonFiles (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:52:16)
at visitExtendedJsonFiles.next ()
at visitExtendedJsonFiles (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:52:16)
at visitExtendedJsonFiles.next ()
at visitExtendedJsonFiles (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:52:16)
at visitExtendedJsonFiles.next ()
at host (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@schematics\angular\migrations\update-10\solution-style-tsconfig.js:63:45)
at MergeMapSubscriber.pipe.operators_1.mergeMap.inputTree [as project] (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules@angular-devkit\schematics\src\rules\call.js:75:24)
at MergeMapSubscriber._tryNext (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules\rxjs\internal\operators\mergeMap.js:69:27)
at MergeMapSubscriber._next (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules\rxjs\internal\operators\mergeMap.js:59:18)
at MergeMapSubscriber.Subscriber.next (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules\rxjs\internal\Subscriber.js:66:18)
at Observable._subscribe (C:\Users\fursdn\development\ForumWebKlient\node_modules@angular\cli\node_modules\rxjs\internal\util\subscribeToArray.js:5:20)

I have not been able to resolve this yet.

[alan-agius4]

@SnorreDanielsen it seems that AnalysisWarning.json contains a symbol which the JSON parser is unable to parse. I have a PR in flight to provide more context #18135.

@DmitryEfimenko, I ran ng update @angular/core @angular/cli --force on the shared project and all migrations have executed successfully.

ng update @angular/core @angular/cli --force
The installed local Angular CLI version is older than the latest stable version.
Installing a temporary version to perform the update.
Installing packages for tooling via yarn.
Installed packages for tooling via yarn.
Using package manager: 'yarn'
Collecting installed dependencies...
Found 48 dependencies.
Fetching dependency metadata from registry...
                  Package "@angular/flex-layout" has an incompatible peer dependency to "tslib" (requires "^1.9.0", would install "2.0.0").
    Updating package.json with dependency @angular/cli @ "10.0.1" (was "9.1.1")...
    Updating package.json with dependency @angular/core @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular-devkit/build-angular @ "0.1000.1" (was "0.901.1")...
    Updating package.json with dependency ng-packagr @ "10.0.0" (was "9.1.1")...
    Updating package.json with dependency @angular/common @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/compiler @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/animations @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/language-service @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular-devkit/build-ng-packagr @ "0.1000.1" (was "0.901.1")...
    Updating package.json with dependency @angular/compiler-cli @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/forms @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency tslib @ "2.0.0" (was "1.11.1")...
    Updating package.json with dependency @angular/platform-browser @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/router @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/platform-browser-dynamic @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency @angular/service-worker @ "10.0.2" (was "9.1.1")...
    Updating package.json with dependency typescript @ "3.9.6" (was "3.8.3")...
UPDATE package.json (2734 bytes)
✔ Packages installed successfully.
** Executing migrations of package '@angular/cli' **

▸ Update Browserslist configuration file name to '.browserslistrc' from deprecated 'browserslist'.
RENAME browserslist => .browserslistrc
  Migration completed.

▸ Update tslint to version 6 and adjust rules to maintain existing behavior.
    tslint configuration does not extend "tslint:recommended" or it extends multiple configurations.
    Skipping rule changes as some rules might conflict.
UPDATE package.json (2734 bytes)
  Migration completed.

▸ Remove deprecated 'es5BrowserSupport' browser builder option.
  The inclusion for ES5 polyfills will be determined from the browsers listed in the browserslist configuration.
  Migration completed.

▸ Replace deprecated and removed 'styleext' and 'spec' Angular schematic options with 'style' and 'skipTests', respectively.
  Migration completed.

▸ Remove deprecated options from 'angular.json' that are no longer present in v10.
UPDATE angular.json (6219 bytes)
  Migration completed.

▸ Add "Solution Style" TypeScript configuration file support.
  This improves developer experience using editors powered by TypeScript’s language server.
  Read more about this here: https://v10.angular.io/guide/migration-solution-style-tsconfig
RENAME tsconfig.json => tsconfig.base.json
CREATE tsconfig.json (488 bytes)
UPDATE e2e/tsconfig.e2e.json (218 bytes)
UPDATE src/tsconfig.app.json (209 bytes)
UPDATE src/tsconfig.spec.json (261 bytes)
  Migration completed.

▸ Add the tslint deprecation rule to tslint JSON configuration files.
  Migration completed.

▸ Update library projects to use tslib version 2 as a direct dependency.
  Read more about this here: https://v10.angular.io/guide/migration-update-libraries-tslib
  Migration completed.

▸ Update workspace dependencies to match a new v10 project.
UPDATE package.json (2734 bytes)
✔ Packages installed successfully.
  Migration completed.

▸ Update 'module' and 'target' TypeScript compiler options.
  Read more about this here: https://v10.angular.io/guide/migration-update-module-and-target-compiler-options
UPDATE tsconfig.base.json (755 bytes)
  Migration completed.

** Executing migrations of package '@angular/core' **

▸ Missing @Injectable and incomplete provider definition migration.
  As of Angular 9, enforcement of @Injectable decorators for DI is a bit stricter and incomplete provider definitions behave differently.
  Read more about this here: https://v9.angular.io/guide/migration-injectable
  Migration completed.

▸ ModuleWithProviders migration.
  As of Angular 10, the ModuleWithProviders type requires a generic.
  This migration adds the generic where it is missing.
  Read more about this here: https://v10.angular.io/guide/migration-module-with-providers
  Migration completed.

▸ Undecorated classes with Angular features migration.
  In version 10, classes that use Angular features and do not have an Angular decorator are no longer supported.
  Read more about this here: https://v10.angular.io/guide/migration-undecorated-classes
  Migration completed.

[Tekk-Know]

I tried to follow @alan-agius4 advice and ran:

ng update @angular/cli --migrate-only --from 9 --to 10

. . .

× Migration failed: Invalid JSON AST Object (AnalysisWarning.json)
See "C:\Users\fursdn\AppData\Local\Temp\ng-s0ved0\angular-errors.log" for further details.

. . .

I am also seeing a very similar issue during my own upgrade from v9.1 to v10. My error differs only slightly from the error received by @SnorreDanielsen.

x Migration failed: Invalid JSON AST Object (messages.json)

[alan-agius4]

@Tekk-Know, your issue is unrelated to this. See: #18120

[mcardoalm]

On initial migration run, on the 4 projects that needed to be updated, we ran:
ng update @angular/core @angular/cli

One project completed all of the migrations for @angular/cli and @angular/core, the other three projects only completed the migrations for @angular/core (not cli).

On the three projects that did not work correctly, it seemed to either skip @angular/cli or it ran @angular/core first then didn't run @angular/cli. On the project that worked, it ran @angular/cli migrations first, then the @angular/core ones and everything worked fine.

All of the projects that didn't work correctly had no errors and appeared to completely successfully, only knew it wasn't right because it didn't do migrations for tsconfig and other things that were expected.

I was able to complete the manual migrations mentioned above:
ng update @angular/cli --migrate-only --from 9 --to 10
ng update @angular/core --migrate-only --from 9 --to 10

[alan-agius4]

@mcardoalm, can you please provide the terminal output of the projects that the migrations didn't work?

[mcardoalm]

@alan-agius4 Sorry I should have saved the output, it didn't show anything unusual, it did the package updates then ran the @angular/core updates and ended.