Where does tsc look to find the ts files for compilation?

Question

Where does tsc look to find the ts files for compilation?

Currently, I am delving into learning AngularJS v2 by thoroughly exploring the official documentation.

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

While experimenting with the tutorial mentioned in the links above, I was impressed to see that upon executing npm start, the application swiftly detected modifications in ts scripts and promptly compiled them into js. It's truly fascinating!

I'm now curious about the underlying code that enables this functionality.

Upon examining the package.json,

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

My assumption is that tsc handles the compilation aspect. What I find perplexing is how tsc identifies the location of ts files for compilation. Where can I access the settings for tsc? Are there options available to optimize the compilation process?

angularjs angular typescript tsc

Answer 1

Answer №1

When the command tsc is called without any parameters, it automatically assumes that you want to compile all TypeScript files starting from your current directory downwards. It starts the search from the directory where the command was executed. (This behavior is not unique to tsc, as any executable can determine its execution location.) The command then recursively searches for any files with a .ts extension in itself and all subdirectories.

To customize compilation options, you can create a tsconfig.json file.

If you include a "files" array in the configuration, you can optimize the compilation process by narrowing down the search scope. However, the impact will be minimal unless you are dealing with a large directory structure.

Answer 2

When the command tsc is called without any parameters, it automatically assumes that you want to compile all TypeScript files starting from your current directory downwards. It starts the search from the directory where the command was executed. (This behavior is not unique to tsc, as any executable can determine its execution location.) The command then recursively searches for any files with a .ts extension in itself and all subdirectories.

To customize compilation options, you can create a tsconfig.json file.

If you include a "files" array in the configuration, you can optimize the compilation process by narrowing down the search scope. However, the impact will be minimal unless you are dealing with a large directory structure.

Answer 3

Answer №2

In most cases, you'll come across a .babelrc file that is utilized by Babel.

This file contains all the necessary configurations for Babel to function properly:

{
  "presets": [
    ["@babel/preset-env", {
      "modules": "commonjs"
    }]
  ],
  "plugins": [
    "@babel/plugin-transform-runtime",
    "@babel/plugin-proposal-class-properties"
  ]
}

To specify the files that need to be transpiled, you can use the include option like so:

"include": [
    "src/**/*.js",
    "tests/**/*"
]

Answer 4

In most cases, you'll come across a .babelrc file that is utilized by Babel.

This file contains all the necessary configurations for Babel to function properly:

{
  "presets": [
    ["@babel/preset-env", {
      "modules": "commonjs"
    }]
  ],
  "plugins": [
    "@babel/plugin-transform-runtime",
    "@babel/plugin-proposal-class-properties"
  ]
}

To specify the files that need to be transpiled, you can use the include option like so:

"include": [
    "src/**/*.js",
    "tests/**/*"
]

Where does tsc look to find the ts files for compilation?

Answer №1

Answer №2

Similar questions

Performing a synchronous request with AngularJS

What is the best way to access an external array using ng-repeat in AngularJS?

What is the most effective way for server.js to send a request to a controller?

Angular variable named templateURL

Is there a way to export a specific portion of a destructuring assignment?

Error: Attempting to access the 'tokenType' property of an undefined object is not allowed

Refresh the cells in the UI ListView

The term 'shuterstock_init' is meant to be a type, however, it is mistakenly being treated as a value in this context

Alert: an issue has been detected in the file located in the directory node_modules/pdfjs

Changing the minimum value in an input type number with AngularJS

Working with Firebase and handling asynchronous data retrieval: Implement success and error callbacks with the

Exploring TypeScript Decorators and the Intricacies of Circular Dependencies

The validation for Australian mobile numbers should include the option to have spaces between the digits

What is the best way to add multiple elements to an array simultaneously?

When you neglect to include 'window' in your Angular expressions, you may encounter the error message "Window referencing is prohibited!"

What is the best way to include $rootScope in an AngularJS unit test?

Calculating the grand total of items in the shopping cart

Refreshing the private route redirects the user to the login page

Looking to integrate a widget into the pages of an Ionic 3 app?

Travis build encountering issues with "The SUID sandbox helper binary was detected, however..."