typescript 如何在 vs-code 中使用多个 tsconfig 文件？

How to use multiple tsconfig files in vs-code?

提问by Mike Jerred

I am using Visual Studio Code and have a fairly common project structure:

我正在使用 Visual Studio Code 并且有一个相当常见的项目结构：

├── client/
│   ├── tsconfig.json
├── shared/
├── server/
│   ├── tsconfig.json
├── project.json

The two tsconfig files have different settings (e.g. the one under client/targets ES5, the one under server/targets ES6). Note that there is no tsconfig in the root directory.

这两个 tsconfig 文件具有不同的设置（例如，client/目标 ES5 下的一个，server/目标 ES6下的一个）。注意根目录下没有tsconfig。

The problem is that I want the shared directory to be included in both projects. I can't do this using tsconfig because the excludeoption won't let me include a folder that is in a higher directory than the tsconfig.json, and using filesI have to constantly keep the list of files up to date as it doesn't support globs.

问题是我希望共享目录包含在两个项目中。我无法使用 tsconfig 执行此操作，因为该exclude选项不允许我包含比 tsconfig.json 更高目录中的文件夹，并且使用files我必须不断保持文件列表最新，因为它没有支持球。

Note that I can compile fine by adding the shared folder into tsc, what I want is for the Visual Studio Code IDE to recognise the shared code for intellisense etc.

请注意，我可以通过将共享文件夹添加到 tsc 中进行编译，我想要的是 Visual Studio Code IDE 识别智能感知等的共享代码。

Is the only option to wait for filesGlob?

是等待filesGlob的唯一选择吗？

采纳答案by basarat

Use a single tsconfig.jsonfor the root. And then extend it for each project (backend tsconfig.server.json, frontend tsconfig.webpack.json).

使用单个tsconfig.json作为根。然后为每个项目（后端tsconfig.server.json，前端tsconfig.webpack.json）扩展它。

• Root tsconfig.jsoninclude: ['src']to ensure all files get typechecked in the IDE
• Backend tsconfig.server.jsonexclude: ['src/app']the frontend files
• Frontend : tsconfig.webpack.jsonexclude: ['src/server']the backend files

• 根tsconfig.jsoninclude: ['src']以确保所有文件都在 IDE 中进行类型检查
• 后端tsconfig.server.jsonexclude: ['src/app']前端文件
• 前端：tsconfig.webpack.jsonexclude: ['src/server']后端文件

Folder Structure

文件夹结构

├── src/
│   ├── app/    < Frontend
│   ├── server/ < Backend
│   ├── common/ < Shared
├── tsconfig.json
├── tsconfig.server.json
├── tsconfig.webpack.json

Config Files

配置文件

tsconfig.json

tsconfig.json

{
  "compilerOptions": {
    "noImplicitAny": true,
    "strictNullChecks": true
  },
  "include": [
    "src"
  ]
}

tsconfig.webpack.json

tsconfig.webpack.json

{
  "extends": "./tsconfig.json",
  "exclude": [
    "src/app"
  ]
}

tsconfig.server.json

tsconfig.server.json

{
  "extends": "./tsconfig.json",
  "exclude": [
    "src/server"
  ]
}

More

更多的

Example lesson

示例课

回答by weagle08

I answered this here: tsconfig extension answer

我在这里回答：tsconfig extension answer

The gist of the answer:

答案的要点：

you can do this by extending your base tsconfig.json file:

你可以通过扩展你的基础 tsconfig.json 文件来做到这一点：

tsconfig extension

tsconfig 扩展

just do not exclude directories in the base tsconfig.json and typescript should be able to resolve your typings for you (know this is true using node_modules/@types, or the typings module)

只是不要排除基础 tsconfig.json 中的目录，typescript 应该能够为您解析您的类型（使用 node_modules/@types 或typings 模块知道这是真的）

For example:

例如：

configs/base.json:

配置/base.json：

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

tsconfig.json:

tsconfig.json：

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

tsconfig.nostrictnull.json:

tsconfig.nostrictnull.json：

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

回答by Mike Jerred

The new version of VSCode supports Typescript 2, add this adds support for globs in tsconfig.json with the includeoption. See http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

新版本的 VSCode 支持 Typescript 2，添加这个添加了对 tsconfig.json 中带有include选项的globs 的支持。见http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

回答by kosiakMD

as another variant bind npm comamnd with next run

作为另一个变体，将 npm comamnd 与下一次运行绑定

{
   'start': '...',
   'buildFront': 'tsc -p tsconfig.someName.josn'
}