Angular 和 Typescript 更新后找不到命名空间“MyApp”

Question

I have a type definition file where all dto objects for my app are exposed to global scope.

DtosGenerator.d.ts

declare module MyApp.Rest.Dto {
   interface IAJsonDto {
   }
 }
 declare module MyApp.Rest.Dto.Post {
   interface ITest1PostDto extends MyApp.Rest.Dto.IAJsonDto {
    code: string;
 }
interface ITest2PostDto extends MyApp.Rest.Dto.IAJsonDto {
    id: number;
 }
interface ITest3PostDto extends MyApp.Rest.Dto.IAJsonDto {
    id: number;
}
  ....
}

And consumed in the following way.

file1.service.ts

import ITest3PostDto = MyApp.Rest.Dto.Post.ITest3PostDto;

My app is build on Angular framework and I have just completed the migration from Angular(8), Typescript(3.5.3) to Angular9,Typescript(3.6.4) respectively. Before migration the consumption of the Dto objects produced no errors and everything seemed normal. After the migration, when the app is built on watch mode running the

ng build --extractCss=true --watch command, the console outputs 'Cannot find namespace 'MyApp'. When I add

/// <reference path="../../../../DtosGenerator.d.ts" /> 

on top of the file the error is produced no more. Is there a way to keep my code as it was before the migration without adding the reference path.

Could anybody tell me what goes wrong?

Answer 1

For anyone who faces of will face the same issue I found the solution. After hours of researching I found out that Angular automatic update ( https://update.angular.io/ ) changed tsconfig.app.json file configuration.

tsconfig.app.json before migration

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
  "outDir": "../out-tsc/app",
  "types": [ "node" ],
  "typeRoots": [
     "node_modules/@types"
  ]
},
"exclude": [
  "test.ts",
  "**/*.spec.ts"
]
}

tsconfig.app.json after migration:

{
 "extends": "../tsconfig.json",
 "compilerOptions": {
   "outDir": "../out-tsc/app",
   "types": [ "node" ],
   "typeRoots": [
     "node_modules/@types"         
   ]
},
"files": [
   "main.ts",
   "polyfills.ts"
 ],
"include": [
  "src/**/*.d.ts"
]
}

The problem is that before migration all files were included in the compilation process and after it only the 2 files specified in the "files" array and all type definition files inside src directory are included. 'DtosGenerator.d.ts' file is located in the root of src folder so some mofications needed to be done to produce the final correct tsconfig.app.json file.

tsconfig.app.json final

{
   "extends": "../tsconfig.json",
   "compilerOptions": {
   "outDir": "../out-tsc/app",    
   "typeRoots": [
      "node_modules/@types"      
   ]
},
  "files": [
    "main.ts",
    "polyfills.ts"
  ],
  "include": [
     "*.d.ts"
  ]
}