我的模块文件夹中的 tsconfig 不会覆盖父文件夹中的扩展 tsconfig peoperty 值答案

【问题标题】：My tsconfig in my module folder does not override the extended tsconfig peoperty values in the parent folder我的模块文件夹中的 tsconfig 不会覆盖父文件夹中的扩展 tsconfig peoperty 值
【发布时间】：2022-07-21 21:04:37
【问题描述】：

我在父文件夹store/aisle/fruits 中有一个tsconfig.json：

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

我在store/aisle/fruits/mango 中有另一个tsconfig.json 来覆盖目标属性。 Price.ts 有一个 async/await 实现，我希望它在生成的 .js 文件中保持原样；因此，将target 值更改为ES2017：

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

但是，由于某种原因，tsc 似乎没有捕捉到mango 文件夹中tsconfig 中的更改，并覆盖了fruits 文件夹中的tsconfig。因此，生成的 .js 包括发出的帮助器 (__awaiter)，这是我不想要的。

所以，我的问题是如何在我的price.js 文件中覆盖目标值以获得所需的效果（只有async/await 而不是__awaiter）？

【问题讨论】：

我的理解是 tsconfig 文件的行为不像 eslint 配置。当您运行tsc 时，您必须为整个构建选择一个，并且只选择一个配置文件。 extends 属性允许您选择的 tsconfig 文件从一个或多个其他 JSON 文件继承属性，但如果您在构建期间选择使用 fruits/tsconfig，您的 mango/tsconfig 文件将被忽略。

标签： typescript tsconfig

【解决方案1】：

只是为了添加一个解决方案以在每个项目中实际构建 child tsconfig.json extends parents tsconfig.json 正在运行 tsc bulding 在每个子 tsconfig.json 扩展父级。

为了动态执行此操作，我们可以使用 npm 工作区。

示例项目

.
├── 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

父./package.json工作区

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

子 ./module-a/package.json 模块-a

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

parent ./tsconfig.json（包含所有要覆盖的选项）

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

孩子./module-a/tsconfig.json

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

为了构建每个模块单独运行在根文件夹工作区：

npm run build --workspaces

构建特定模块

npm run build --workspace=module-a

注意：运行npm install 会将所有模块安装在一个node_modules 文件夹中

【讨论】：