What is the point in specifying types when extending tsconfig?

Question

I have an angular app that uses @types and some custom typings. For some reason when I serve the app it works, and when I run my tests using ng test it cant find the custom typings. I cant understand why that is anymore and I dont understand how you're supposed to manage extending the config or why you would want different typings available between serving and testing.

Here is my configs that were auto generated:

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

tsconfig.app.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "allowSyntheticDefaultImports" : true,
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "types": []
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ]
}

tsconfig.spec.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/spec",
    "module": "commonjs"
  },
  "files": [
    "test.ts",
    "polyfills.ts"
  ],
  "include": [
    "**/*.spec.ts",
    "**/*.d.ts"
  ]
}

I have tried many different variations and still dont understand why it works on serving but not testing. I understand that not specifying the types array means that all types should be grabbed? Yet the opposite seems to be true.

If anyone can shed some light I'd appreciate it.

Answer 1

Error was not caused by missing type, rather by missing global function for type.