Adding linter to multi-project workspace results in incomplete/broken configuration

🐞 Bug report

Description

When adding @angular-eslint/schematics to a workspace that was initially created with --create-application=false, the .eslintrc.json files are not added to the workspace root, or to the project directories (if projects exist) and the architect/lint sections are not added to project definitions in angular.json regardless of whether the projects are created before or after adding @angular-eslint/schematics.

Minimal Reproduction

ng new workspace --create-application=false
cd workspace
ng add @angular-eslint/schematics
ng generate library lib1

Exception or Error

When attempting to run the linter, the following error is produced even after the above steps are performed

Cannot find "lint" target for the specified project.

You should add a package that implements linting capabilities.

For example:
  ng add @angular-eslint/schematics

Environment

• Windows 10
• @angular/cli 12.1.4

Angular CLI: 12.1.4
Node: 14.16.0
Package Manager: npm 7.21.0
OS: win32 x64

Angular: 12.1.5
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1201.4
@angular-devkit/build-angular   12.1.4
@angular-devkit/core            12.1.4
@angular-devkit/schematics      12.1.4
@angular/cli                    12.1.4
@schematics/angular             12.1.4
ng-packagr                      12.2.1
rxjs                            6.6.7
typescript                      4.3.5

Additional Information

It seems that adding the linter to a single-project workspace, which later includes additional projects, results in success and covers all projects as expected.

[Francesco-Manicardi]

Here’s the intended way to install eslint in a multi project workspace setup:

in root directory, run ng add @angular-eslint/schematics

For each child project, run: ng g @angular-eslint/schematics:add-eslint-to-project <your-project-name-goes-here>

[bogacg]

You need to execute once more ng add @angular-eslint/schematics for it to work its magic. First execution only adds packages, after you create your lib/app by executing that command for the second time it understands what it has to do.

However the situation is still not perfect. That second execution generates an eslintrc.json under lib/app with "extends": "../../.eslintrc.json", being its first option which is kind of faulty since ng add @angular-eslint/schematics did not generate that root file in neither execution so you get error. Removing that extends option makes things work as far as I can see.

It’s already reported #462