How does tsc know where are the ts files to compile?

Question

I am trying to learn angularjs v2 from the official documentation.

https://angular.io/docs/ts/latest/tutorial/toh-pt1.html

https://github.com/angular/quickstart

While following the tutorial in the above link, I noticed that after running npm start, the software is able to detect changes in ts scripts and compile immediately to js. This is amazing!

I am trying to figure out where is the code that made this possible.

From package.json,

"scripts": {
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",

I am guessing that tsc is responsible for the compilation. What puzzles me is how does tsc know where are the ts files to compile? Where can I configure the settings for tsc? Are there settings to optimize the compilation process?

Answer 1

When you call tsc without any parameters. It simply assumes that you want to compile all typescript files from your current directory downwards. It uses the directory that the command was called from to start the search. (There's nothing special about this, any executable can find out where it was executed from) Then it simply does a recursive /**/*.ts search for any files in itself and all subdirectories.

You can create a tsconfig.json to specify options.

Obviously if you specify the "files" array in the config you will optimize your compilation process as you won't need to search through all available folder. However the difference will be nominal unless you have a massive directory structure.

Answer 2

There is usually a tsconfig.json somewhere which is used by TypeScript.

The content has the config necessary for that purpose:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "typeRoots": [
      "../../node_modules/@types/"
    ]
  },
  "compileOnSave": true,
  "exclude": [
    "node_modules/*",
    "**/*-aot.ts"
  ]
}

Now you can use files option like this:

"files": [
    "core.ts",
    "sys.ts",
    "types.ts",
    "scanner.ts"
    ]

Or you can use include to include a path:

"include": [
    "src/**/*"
],