Angular library project build fails in multi-project workspace – cannot find namespace

I have the following Angular multi-project file structure:

-AngularMultiProject
  -projects
     -mobile-app
     -shared-lib
     -web-app
  -ViewModels
     -Common
        -myviewmodel1.d.ts
        -myviewmodel2.d.ts

The shared-lib project and the web-app project are referencing viewmodels from the application root folder. I can build the web-app project, but not the shared-lib project. I get the following error:

EROR: …component.ts:12:27 – error TS2503: Cannot find namespace ‘Common’.

The typescript configuration for both projects is the same:

AngularMultiProject/tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "module": "esnext",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    //"downlevelIteration": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom",
      "es2019"
    ],
    "paths": {
      "shared": [
        "dist/shared/shared",
        "dist/shared"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

shared-lib/tsconfig.lib.json and web-app/tsconfig.lib.json

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "types": []
  }, 
  "include": [
    "src/**/*.d.ts",
    "../../ViewModels/**/*.d.ts"
  ]
}

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.