guagay_wk
guagay_wk

Reputation: 28090

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

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?

Upvotes: 0

Views: 1538

Answers (2)

williamsandonz
williamsandonz

Reputation: 16430

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.

Upvotes: 4

Yaser
Yaser

Reputation: 5719

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/**/*"
],

Upvotes: 2

Related Questions