My tsconfig in my module folder does not override the extended tsconfig peoperty values in the parent folder

Viewed 337

I have a tsconfig.json in the parent folder store/aisle/fruits:

{
  "compileOnSave": true,
  "compilerOptions": {
    .
    .
    "target": "es6",
    "noEmitOnError" : true,
    "noEmitHelpers": false,
    "stripInternal": true,
    "removeComments": true,
    "declaration": true
  }
}

And I have another tsconfig.json in store/aisle/fruits/mango to override the target property. Price.ts has an async/await implementation and I want it to remain as such in the generated .js files; hence, changing target value to ES2017:

{
  "extends": '../tsconfig',
  "compilerOptions": {
    "target": "ES2017"
  },
  "files": ["Price.ts", "index.ts"]
}

For some reason, however, the tsc does not seem to catch the changes in the tsconfig in the mango folder and override the tsconfig in the fruits folder. Therefore, the generated .js includes the emitted helpers (__awaiter), which I do not want.

So, my question is how can I override the target value to get the desired effect (having only the async/await and not __awaiter) in my price.js file?

1 Answers

Just to add a solution to actually build child tsconfig.json in each project extends parents tsconfig.json is running tsc bulding in each child tsconfig.json that extends the parent one.

In order to do this dynamically we can use npm workspaces.

Example project

.
├── module-a
│   ├── index.ts
│   ├── package.json  // child package json that contains its own script build
│   └── tsconfig.json // child tsconfig
│
├── module-b
│   ├── index.ts
│   ├── package.json  // child package json that contains its own script build
│   └── tsconfig.json // child tsconfig
│
├── package.json      // parent package.json workspace
└── tsconfig.json // parent tscongig

parent ./package.json workspace

{
  "name": "workspace-example",
  "version": "1.0.0",
  "workspaces": [
        "module-a", 
        "module-b"
  ]
}

child ./module-a/package.json module-a

{
    "name": "module-a",
    "version": "1.0.0",
    "main": "index.js",
    "scripts": {
      "build" : "tsc" // could be any command
    }
}

parent ./tsconfig.json ( contains all options to be overrided )

{
    "compilerOptions": {
        "module": "CommonJS",
        "noUnusedLocals": true,
        "sourceMap": false,
        "outDir": "build",
        "target": "ES2017",
      },
      "compileOnSave": true  
}

child ./module-a/tsconfig.json

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "build-module-a", // overriding
        "sourceMap": "true",  // overriding
    }
}

In order to build each modules separately run on root folder workspace:

npm run build --workspaces

build specific module

npm run build --workspace=module-a

Note: Running npm install will install all modules in one node_modules folder

Related