[bug] [Typescript 3.9] Cannot read property 'paths' of undefined

[raxon]

Current Behavior

Typescript 3.9 add tsconfig.base.json instead ts.config.json

Expected Behavior

Change tsconfig.json to tsconfig.base.json

Steps to Reproduce

• Run new project
• Update project to Angular 10.0.1
• add lib by nx g @nwrl/angular
• we have an error

Failure Logs

Cannot read property 'paths' of undefined

Environment

"dependencies": { "@nrwl/angular": "9.4.5", "@angular/animations": "^10.0.1", "@angular/common": "^10.0.1", "@angular/compiler": "^10.0.1", "@angular/core": "^10.0.1", "@angular/forms": "^10.0.1", "@angular/platform-browser": "^10.0.1", "@angular/platform-browser-dynamic": "^10.0.1", "@angular/router": "^10.0.1", "core-js": "^3.6.5", "rxjs": "~6.5.5", "zone.js": "^0.10.3" }, "devDependencies": { "@angular/cli": "10.0.0", "@nrwl/workspace": "9.4.5", "@types/node": "~14.0.14", "dotenv": "8.2.0", "ts-node": "~8.10.2", "tslint": "~6.1.2", "eslint": "7.3.1", "typescript": "~3.9.5", "prettier": "2.0.5", "@angular/compiler-cli": "^10.0.1", "@angular/language-service": "^10.0.1", "@angular-devkit/build-angular": "0.1000.0", "codelyzer": "~5.2.2", "jest-preset-angular": "8.2.1", "@nrwl/jest": "9.4.5", "jest": "26.1.0", "@types/jest": "26.0.3", "ts-jest": "26.1.1", "cypress": "^4.9.0", "@nrwl/cypress": "9.4.5" }

[abdes]

oh man! Looking at the code, 'tsconfig.json' is hard-coded everywhere... it's gonna be complicated to fix and I don't see how we can work around it unless we just give up a lot of the features of Nx while waiting... The tradeoff is not easy. In one hand, we can finally have vscode work properly and angular 10, in the other hand we need to forget about Nx schematics for the time being.

Appreciate some feedback from the devs on this one.

[joshuawwright]

You can temporarily use the schematics by renaming the tsconfig.base.json to tsconfig.json. Not a great solution, but a way to access the schematics in the meantime.

Just make sure you back up the original tsconfig.json.

[MaxSassen]

just adding the following on the tsconfig.json:
"compilerOptions": { "baseUrl": ".", "rootDir": "." },

worked for me... as a temp solution.

[eshkard]

just adding the following on the tsconfig.json: "compilerOptions": { "baseUrl": ".", "rootDir": "." },

worked for me... as a temp solution.

Exelent temporary solution.

To NX Dev team this is a major issue that holds back from migration to angular 10.

[bilalshaikh42]

One additional issue that arises even when using the above trick. The tsconifg.json file generated for the library will extend from the tsconfig.json file at the base directory. This needs to be updated manually to tsconfig.base.json. Other than that, I believe everything else works.

[vsavkin]

This is fixed in Nx 10. Angular schematics now assume the presence of tsconfig.base.json. Could you try version https://www.npmjs.com/package/@nrwl/workspace/v/10.0.0-beta.0?

[abdes]

@vsavkin why do the generation schematics now delete the tsconfig.json at the workspace root (the solution tsconfig, only containing references)?

Nx works fine so far in 10.0.0.beta.0 with tsconfig.base.json, I can run dep-graph, affected, etc... but when I generated a library project it deleted my solution tesconfig.json. That file was the whole point from ts 3.9 upgrade, to allow us to work within vscode with all paths setup. Maybe I'm doing something wrong?

> Executing task: ng generate @nrwl/angular:library --name=ngx-scrollable-nav-bar --style=scss --directory=published --prefix=hc --publishable --simpleModuleName --tags='scope:published, type:ui' <

DELETE tsconfig.json
CREATE tslint.json (1671 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/ng-package.json (188 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/package.json (223 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/README.md (188 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/tsconfig.lib.json (411 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/tsconfig.lib.prod.json (174 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/tslint.json (239 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/src/index.ts (53 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/src/lib/ngx-scrollable-nav-bar.module.ts (175 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/tsconfig.json (254 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/jest.config.js (409 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/tsconfig.spec.json (236 bytes)
CREATE libs/published/ngx-scrollable-nav-bar/src/test-setup.ts (30 bytes)
UPDATE angular.json (18648 bytes)
UPDATE nx.json (1578 bytes)
UPDATE tsconfig.base.json (1310 bytes)

Also, I'm having trouble editing the generated tsconfig.json in the library project to specify my own "include" globs. If I do so, ts complains:

Referenced project 'xxxxx/libs/published/ngx-scrollable-nav-bar/tsconfig.lib.json' must have setting "composite": true.

I do not have such problem if I use my workspace root tsconfig.json which only inlcudes "files" and "references" and remove the ones generated in the library tsconfig.json.

When I previously used angular CLI in a different project, angular does put the tsconfig.json in the workspace root as well and puts all references there.

If you wanna take a look at the full workspace I'm using, it's all available at: https://github.com/abdes/happy-coding. What's there works fine with Nx 9 if I hack the workspace root tsconfig as mentioned above, and also works fine with Nx 10 with no tsconfig hacks at all, but a newly generated library has the problems I mentioned above.

[bilalshaikh42]

This is fixed in Nx 10. Angular schematics now assume the presence of tsconfig.base.json. Could you try version https://www.npmjs.com/package/@nrwl/workspace/v/10.0.0-beta.0?

The update did fix the issue for me regarding the base file. I did not encounter the problem that @abdes is describing. However, I do include the root tsconfig hack in the new version as well. Perhaps that is making some difference between us?

[bilalshaikh42]

It seem that the issue is fixed only in the angular schematics as @vsavkin mentioned. However, if angular.json is used as the underlying file, then a similar error appears when trying to generate a @nrwl/node library or a @nrwl/workspace library. I get "Cannot read property 'types' of undefined"

[abdes]

This is fixed in Nx 10. Angular schematics now assume the presence of tsconfig.base.json. Could you try version https://www.npmjs.com/package/@nrwl/workspace/v/10.0.0-beta.0?

Just reporting that as of beta.5 of Nx when executing an update from Nx9/Ng9 to Nx10/Ng10 at the same time, Nx migration will fail due to Ng migration having already created the tsconfig.base.json.

env:PS>yarn nx update @angular/cli @angular/core @nrwl/angular @nrwl/cypress @nrwl/jest @nrwl/workspace --next --force

.
.
.
** Executing migrations of package '@nrwl/workspace' **

> Add default branch to nx.json
UPDATE package.json (2143 bytes)
UPDATE nx.json (703 bytes)
  Migration completed.

> Migrate tsconfigs to solution style tsconfigs
× Migration failed: Path "/tsconfig.base.json" already exist.

The end result does not have root tsconfig.json (solution style tsconfig previously created by Ng10 migration containing references only), and I'm not sure if that's intended or not.

EDIT: Fresh Nx workspace at 10.0.0-beta.5 works fine for me now, app schematic, lib schematic, and nx affected commands all good. I understand that no more tsconfig at root, but references added to each project tsconfig. VS Code seems to work fine with it.

[curiouscod3]

The Solution to fix this issue is here if you still can't fix this even after updated the version.

  1) Terminate VSCode Completely !
  2) Restart VSCode with new window.
  3) Only Add the project not others. This can be important to smoothly reindex.
  3) CMD+Shift+P and Type 'Restart Angular Language Server' and Select it
  4) (optional)  ' Restart TS Server'
  5)  You may need restart again and do it again.

I fixed it like this way.. Hope it was helpful for someone like me.

[abdes]

Latest version of Nx fully resolves these issues and brings a pretty clean way of making the hierarchical tsconfig work in command line build and inside vscode.

[curiouscod3]

Latest version of Nx fully resolves these issues and brings a pretty clean way of making the hierarchical tsconfig work in command line build and inside vscode.

I am using the latest NX and Angular version. I've faced the issue again.. It was required to restart the the Angular/TS service. Maybe this issue is related to VScode, not NX..

[emjimadhu]

I am facing the same issue when i try @nrwl/nest:lib schematic. It was working before but after updating "@nrwl/nest": "10.0.10",

Edit: it is happening for all the plugins it seems. I tried with react. Had same error.

[masonembry]

Same with me. Does anyone have a solution? I cannot generate libs.

[yingw787]

Wanted to second @emjimadhu's concern with plugin @nrwl/react; after multiple attempts at trying to get migrations to run properly for fork of plugin @dev-thought/nx-deploy-it, got this error message:

Running migration @nrwl/nest:update-10-0-0
Cannot read property 'startsWith' of undefined
/home/yingw787/src/nx-plugins/node_modules/yargs/yargs.js:1109
      else throw err
          ^

Error: Command failed: ./node_modules/.bin/tao migrate --run-migrations=migrations.json
    at checkExecSyncError (child_process.js:630:11)
    at Object.execSync (child_process.js:666:15)
    at Object.handler (/home/yingw787/src/nx-plugins/node_modules/@nrwl/workspace/src/command-line/nx-commands.js:77:21)
    at Object.runCommand (/home/yingw787/src/nx-plugins/node_modules/yargs/lib/command.js:235:44)
    at Object.parseArgs [as _parseArgs] (/home/yingw787/src/nx-plugins/node_modules/yargs/yargs.js:1022:30)
    at Object.get [as argv] (/home/yingw787/src/nx-plugins/node_modules/yargs/yargs.js:965:21)
    at Object.initLocal (/home/yingw787/src/nx-plugins/node_modules/@nrwl/cli/lib/init-local.js:24:13)
    at Object.<anonymous> (/home/yingw787/src/nx-plugins/node_modules/@nrwl/cli/bin/nx.js:12:18)
    at Module._compile (internal/modules/cjs/loader.js:1138:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 652052,
  stdout: null,
  stderr: null
}

~Interesting~ Interested to know what the right solution is.

[FrozenPandaz]

it is happening for all the plugins it seems. I tried with react. Had same error.

Can you please open a separate issue with a reproduction, please?

got this error message:

This seems related to a different issue which has already been closed. https://github.com/nrwl/nx/issues/3387

Was the workspace perhaps already on nest 7?

Latest version of Nx fully resolves these issues

I think so as well. I think this issue can be closed since most details are from a different time period where Nx 10 was not out yet. New issues will likely provide more relevant context around the issue.

[emjimadhu]

@FrozenPandaz Sorry to reply in this issue after it has been closed. I have found the solution. You were right, i created my workspace like 4 months back, that time the base/root tsconfig file named it as tsconfig.json. And i believe from NX 10, it was renamed to tsconfig.base.json. That was the cause of the problem.

So for anyone having the same issue, rename your root tsconfig.json to tsconfig.base.json and rename all the other tsconfig files which extends from root tsconfig.

Thanks.

[KevTale]

@emjimadhu it doesn't work for me. Angular 10 migration already renamed my tsconfig.json to tsconfig.base.json and rename the extends of other tsconfig library. Also, tsconfig.json is still existing at the root (along side with tsconfig.jbase.son) with the "solution style" typescript proposed.

Anyway, whenever I try to generate a lib with @nrwl/angular:library, it goes Cannot read property 'paths' of undefined.

"dependencies": { "@angular/animations": "~10.0.8", "@angular/common": "~10.0.8", "@angular/compiler": "~10.0.8", "@angular/core": "~10.0.8", "@angular/forms": "~10.0.8", "@angular/platform-browser": "~10.0.8", "@angular/platform-browser-dynamic": "~10.0.8", "@angular/router": "~10.0.8", "@ngrx/effects": "10.0.0", "@ngrx/entity": "10.0.0", "@ngrx/router-store": "10.0.0", "@ngrx/store": "10.0.0", "@nrwl/angular": "10.0.11", "core-js": "^2.5.4", "rxjs": "~6.5.5", "tslib": "^2.0.0", "zone.js": "^0.10.3" }, "devDependencies": { "@angular-devkit/build-angular": "~0.1000.5", "@angular-devkit/build-ng-packagr": "~0.1000.5", "@angular/cli": "~10.0.5", "@angular/compiler-cli": "~10.0.8", "@angular/language-service": "~10.0.8", "@ngrx/schematics": "10.0.0", "@ngrx/store-devtools": "10.0.0", "@nrwl/jest": "10.0.11", "@nrwl/workspace": "10.0.11", "@types/jest": "24.9.1", "@types/node": "~8.9.4", "codelyzer": "^6.0.0", "dotenv": "6.2.0", "eslint": "6.8.0", "jest": "24.9.0", "jest-junit": "^10.0.0", "jest-preset-angular": "8.0.0", "ng-packagr": "^10.0.0", "prettier": "2.0.5", "ts-jest": "24.0.0", "ts-node": "~7.0.0", "tslint": "~6.1.0", "typescript": "~3.9.7", "cypress": "^4.1.0", "@nrwl/cypress": "10.0.11" }

[hcharley]

@emjimadhu Thank you, renaming to tsconfig.base.json fixed my react library generation problem.

Perhaps something can be done when things are renamed next time to help people upgrade.

[shayll-herolo]

I encounter almost the same as @GreatHawkeye. My error though is Path "/libs/layout/tsconfig.lib.prod.json" does not exist. It started with Angular 9, I thought upgrading to v 10 will solve it. When I create the file myself and then run the command nx g lib layout it worked and even deleted this new tsconfig.lib.prob.json file I created. The migration already changed everything to have tsconfig.base.json and tsconfig.json doesn't exist anymore.

[kjetilhp]

I've got the same problem in an older, updated workspace, in a newly created project I'm able to generate an ui lib. Booth projects are at the same (latest) versions on all modules, only differences beside one being newly created is that the new one uses npm instead of yarn and has ivy enabled.. I guess that should not matter. However..

Looking at the code in: node_modules/@nrwl/angular/src/schematics/library/library.js Line 211 return workspace_1.updateJsonInTree('tsconfig.json', json => { and then changing that to
return workspace_1.updateJsonInTree('tsconfig.base.json', json => { made it possible generating an angular lib

[abhayfrontend]

rename tsconfig.json to tsconfig.base.json and update the extends too.

[kodenix]

The Solution to fix this issue is here if you still can't fix this even after updated the version.

  1) Terminate VSCode Completely !
  2) Restart VSCode with new window.
  3) Only Add the project not others. This can be important to smoothly reindex.
  3) CMD+Shift+P and Type 'Restart Angular Language Server' and Select it
  4) (optional)  ' Restart TS Server'
  5)  You may need restart again and do it again.

I fixed it like this way.. Hope it was helpful for someone like me.

you are right, the problem is VSCode, not NX, with the steps you have indicated the problem is fixed. Thanks

[AsmisAlan]

Hello! FYI, the angular 11 migration schematic rename the tsconfig.base.json to tsconfig.json.

[CharlieGreenman]

@FrozenPandaz just to let you know, while of course it might be quite a bit of people stammering etc., I can confirm this is indeed an issue. I migrated from nrwl 9 to 11, and tsconfig.json was not changed to tsconfig.base.json. What I did was reference a new nrwl workspace issue from scratch, and that solved it. I.e. saw tsconfig.json is now called tsconfig.base.json. I did the refactor for all extends via my editor of choice(i.e. Webstorm). While I am unfamiliar with the codebase, a perusal into the nx migrate code/logic should show this fault. Someone of less technical expertise would potentially spend more time on something like this. Thank you again, and thank you again for all of your hard work

[dynamikus]

@CharlieGreenman tsconfig.base.json should work. I updated from 10 to 11 I renamed from tsconfig.json to tsconfig.base.json and it worked (at least for me)

[github-actions[bot]]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.