[SOLVED] Visual Studio Code can't resolve angular's tsconfig paths


I’m trying to import some services using barrels and tsconfigs paths options but I can’t get angular and vscode to get along.

If it works for one it doesn’t for the other and viceversa…

My situation seems to be pretty simple:

  • in src/app/services I have a service which is exported in a index.ts
  • my src/tsconfig.app.json is just this:

  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "types": [],
    "baseUrl": ".",
    "paths": {
      "services": ["app/services"]
  "exclude": [

and my angular app compiles with no issues, but vscode keep giving me errors every time I try to import my service from 'services' giving me [ts] Cannot find module 'services'.


I’m using typescript 3.1.6 and in vscode settings I have "typescript.tsdk": "C:/Users/myuser/AppData/Roaming/npm/node_modules/typescript/lib" (I also tried to leave the default setting, no changes)


if I specify paths in ./tsconfig.json starting from src, vscode is happy but angular is not.

if I specify paths in both tsconfig.json and src/tsconfig.app.json, both vscode and angular are happy, but it seems a too stupid workaround to me…


I figured it out, even if I’m keep thinking that is all absurd…

VsCode automatically looks for a tsconfig.json file and it doesn’t care about tsconfig.app.json, so paths needs to be specified in tsconfig.json.

At the same time, the angular-cli scaffolding specify a baseUrl parameter in tsconfig.app.json which overrides the upper one.

The solution is to delete baseUrl parameter in the tsconfig.app.json or edit its value to "../"

(As a personal remark, given that vscode is largely used to build angular solutions, I think that there’s something that should be revisited in the angular-cli scaffolding or in how vscode looks for tsconfig files)

Answered By – Doc

Answer Checked By – Pedro (BugsFixing Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *