tsc如何知道要编译的ts文件在哪里?

时间:2022-07-01 08:10:22

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

我正在尝试从官方文档中学习angularjs v2。

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

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

https://github.com/angular/quickstart

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!

按照上面链接中的教程,我注意到在运行npm start之后,软件能够检测ts脚本中的更改并立即编译为js。这真太了不起了!

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

我试图找出使这成为可能的代码在哪里。

From package.json,

来自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?

我猜tsc负责编译。令我困惑的是,tsc如何知道要编译的ts文件在哪里?我在哪里可以配置tsc的设置?是否有优化编译过程的设置?

2 个解决方案

#1


2  

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.

当你没有任何参数调用tsc时。它只是假设您要从当前目录向下编译所有打字稿文件。它使用调用命令的目录来开始搜索。 (没有什么特别的,任何可执行文件都可以找到它的执行位置)然后它只是一个递归的/**/*.ts搜索本身和所有子目录中的任何文件。

You can create a tsconfig.json to specify options.

您可以创建tsconfig.json来指定选项。

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.

显然,如果在配置中指定“files”数组,您将优化编译过程,因为您不需要搜索所有可用文件夹。但是,除非你有一个庞大的目录结构,否则差异将是名义上的。

#2


3  

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

TypeScript通常使用tsconfig.json。

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来包含路径:

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

#1


2  

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.

当你没有任何参数调用tsc时。它只是假设您要从当前目录向下编译所有打字稿文件。它使用调用命令的目录来开始搜索。 (没有什么特别的,任何可执行文件都可以找到它的执行位置)然后它只是一个递归的/**/*.ts搜索本身和所有子目录中的任何文件。

You can create a tsconfig.json to specify options.

您可以创建tsconfig.json来指定选项。

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.

显然,如果在配置中指定“files”数组,您将优化编译过程,因为您不需要搜索所有可用文件夹。但是,除非你有一个庞大的目录结构,否则差异将是名义上的。

#2


3  

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

TypeScript通常使用tsconfig.json。

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来包含路径:

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