How can we have multiple tsconfig file for angular app?

[admin]

One tsconfig file is enough for your project but if still for some of technical reasons you want to have more than one for example create 2 different tsconfig files (e.g. tsconfig.a.json and tsconfig.b.json) then you need to add a script when building to copy over tsconfig.json with the desired script using extend.

For example:
Refer official documentation https://www.typescriptlang.org/docs/han ... th-extends

Here you can see :
A tsconfig.json file can inherit configurations from another file using the extends property.

The extends is a top-level property in tsconfig.json (alongside compilerOptions, files, include, and exclude). extends’ value is a string containing a path to another configuration file to inherit from.

The configuration from the base file are loaded first, then overridden by those in the inheriting config file. If a circularity is encountered, we report an error.

files, include and exclude from the inheriting config file overwrite those from the base config file.

All relative paths found in the configuration file will be resolved relative to the configuration file they originated in.

For example:
configs/base.json:

Code: Select all

{
  "compilerOptions": {
    "noImplicitAny": true,
    "strictNullChecks": true
  }
}

tsconfig.json:

Code: Select all

{
  "extends": "./configs/base",
  "files": [
    "main.ts",
    "supplemental.ts"
  ]
}

tsconfig.nostrictnull.json:

Code: Select all

{
  "extends": "./tsconfig",
  "compilerOptions": {
    "strictNullChecks": false
  }
}

If you don't want to use above method then as an alternative you can modify your package.json and it will do the same for you. Let's assume you have appX and appY for appX you want to execute tsconfig.x.json and for appY you have tsconfig.y.json then you can modify you package.json as mentioned below:

Code: Select all

{
  build:appX="cp tsconfig.x.json tsconfig.json && npm run build"
  build:appY="cp tsconfig.y.json tsconfig.json && npm run build"
}