问题

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

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

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

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.

Is the only option to wait for filesGlob?

回答1:

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

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

Folder Structure

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

Config Files

tsconfig.json

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

tsconfig.server.json

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

tsconfig.webpack.json

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

Example lesson

回答2:

I answered this here: tsconfig extension answer

The gist of the answer:

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

tsconfig extension

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)

For example:

configs/base.json:

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

tsconfig.json:

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

tsconfig.nostrictnull.json:

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

回答3:

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

回答4:

as another variant bind npm comamnd with next run

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

来源：https://stackoverflow.com/questions/37579969/how-to-use-multiple-tsconfig-files-in-vs-code

标签

typescript

visual-studio-code

tsconfig

How to use multiple tsconfig files in vs-code?

问题