自动编译

手动模式：每次ts文件修改完，手动编译一次

tsc 01.ts

监视模式：ts文件修改完，自动监视编译

tsc 01.ts -w

编译所有文件手动模式：
上面两个模式只能编译和监视当前文件，用tsc可以编译所有文件，在改文件中新增一个配置文件，tsconfig.json 空文件即可，里边什么也不填 或者填 {}

这时候执行tsc就可以编译该文档下所有文件了

tsc

监视模式：

tsc -w

补充：

tsc init     //初始化tsconfig.json

tsconfig.json是一个JSON文件，可以添加配置信息

{
  // 此json文件中可以写注释！
  /*
    tsconfig.json是ts编译器的配置文件，ts编译器可以根据它的信息来对代码进行编译
  */

  /*
    "include" 用来指定哪些ts文件需要被编译
      默认：当前路径下所有文件, ***
      路径：** 表示任意目录
            * 表示任意文件
  */
  "include": [
    "./src/**/*"
  ],
  /*
    "exclude" 不需要被编译的文件目录
    默认值：
      ["node_modules", "bower_components", "jspm_packages", "./dist"]
  */
  "exclude": [
    "./src/exclude/**/*"
  ],
  /*
    被继承的配置文件
    例如："extends": "。/configs/base",
  */
  //  "extends": "",
  /*
    指定被编译文件的列表，只有需要编译的文件少时才会用到
  */
  //  "files": [],
  /*
    compilerOptions 编译器的选项
  */
  "compilerOptions": {
    // target 用来指定ts被编译为的ES的版本
    // 'es3', 'es5', 'es6', 'es2015', 'es2016', 'es2017', 'es2018', ...
    "target": "es2015",
    // module 指定要使用的模块化的规范
    // 'none', 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', ...
    "module": "es2015",
    // lib用来指定项目中要使用的库
    // 在node项目中可以声明用到的库，在前端中可以声明dom(浏览器中的内置库，但是在node中是不需要的！)
    // 默认就是在浏览器中的运行环境！
    //'es5', 'es6', 'es2015', 'es7', 'es2016', 'es2017', 'es2018', 'es2019', 'es2020',
    // 'esnext', 'dom', 'dom.iterable', ...
    "lib": [
      "es6",
      "dom"
    ],
    // outDir 用来指定编译后文件所在的目录
    "outDir": "./dist",
    // 将代码合并为一个文件
    // 设置outFile后，所有的全局作用域中的代码会合并到同一个文件中
    //"outFile": "./dist/app.js"
    // 是否对js文件进行编译，默认是false
    "allowJs": true,
    // 是否检查js代码是否符合语法规范，默认是false
    "checkJs": true,
    // 是否移除注释
    "removeComments": true,
    // 不生成编译后的文件
    // 仅用TS检查语法
    "noEmit": false,
    // 当有错误时不生成编译后的文件
    "noEmitOnError": true,
    /*
      语法检查属性
    */
    // 所有严格检查的总开关
    "strict": true,
    // 用来设置编译后的文件是否使用严格模式，默认false
    // 在ES6中的模块化会自动使用严格模式，而无需在文件开头添加`'use strict'`
    "alwaysStrict": true,
    // 不允许隐式的any类型
    "noImplicitAny": true,
    // 不允许不明确类型的this
    "noImplicitThis": true,
    // 严格的检查空值
    "strictNullChecks": true
  }

tsconfig.json配置选项

include 比较重要

定义希望被编译文件所在的目录 ，默认值：[“**/*”]

  "include":["src/**/*", "tests/**/*"]  
  ** 任意目录
  * 任意文件
  所有src目录和tests目录下的文件都会被编译

exclude

定义需要排除在外的目录
默认值：[“node_modules”, “bower_components”, “jspm_packages”]

  "exclude": ["./src/hello/**/*"]
  src下hello目录下的文件都不会被编译

extends

定义被继承的配置文件

"extends": "./configs/base"
//当前配置文件中会自动包含config目录下base.json中的所有配置信息

files

指定被编译文件的列表，只有需要编译的文件少时才会用到

//示例
"files": [
    "core.ts",
    "sys.ts",
    "types.ts",
    "scanner.ts",
    "parser.ts",
    "utilities.ts",
    "binder.ts",
    "checker.ts",
    "tsc.ts"
  ]
  //列表中的文件都会被TS编译器所编译

compilerOptions 比较重要

编译器的选项
编译选项是配置文件中非常重要也比较复杂的配置选项
在compilerOptions中包含多个子选项，用来完成对编译的配置

项目选项有以下几种:

1. target
设置ts代码编译的目标版本 ，可选值：
ES3（默认）、ES5、ES6/ES2015、ES7/ES2016、ES2017、ES2018、ES2019、ES2020、ESNext

//示例
"compilerOptions": {
    "target": "ES6"
}
//我们所编写的ts代码将会被编译为ES6版本的js代码

2. lib
一般情况下不需要修改 指定代码运行时所包含的库（宿主环境）,可选值：
ES5、ES6/ES2015、ES7/ES2016、ES2017、ES2018、ES2019、ES2020、ESNext、DOM、WebWorker、ScriptHost …

//示例
"compilerOptions": {
    "target": "ES6",
    "lib": ["ES6", "DOM"],
    "outDir": "dist",
    "outFile": "dist/aa.js"
}

3. module
设置编译后代码使用的模块化系统， 可选值：
CommonJS、UMD、AMD、System、ES2020、ESNext、None

//示例
"compilerOptions": {
    "module": "ES2015"   //编译后使用es6模块
}

4. outDir

编译后文件的所在目录
默认情况下，编译后的js文件会和ts文件位于相同的目录，设置outDir后可以改变编译后文件的位置

//示例：
"compilerOptions": {
    "outDir": "./dist"
}
//设置后编译后的js文件将会生成到dist目录

5. outFile

将所有的文件编译为一个js文件
默认会将所有的编写在全局作用域中的代码合并为一个js文件，如果module制定了None、System或AMD则会将模块一起合并到文件之中

//示例：
"compilerOptions": {
    "outFile": "./dist/app.js"
}

6. rootDir

指定代码的根目录，默认情况下编译后文件的目录结构会以最长的公共目录为根目录，通过rootDir可以手动指定根目录

//示例
"compilerOptions": {
    "rootDir": "./src"
}

7. allowJs

是否对js文件编译

8. checkJs

是否对js文件进行检查

//示例：
"compilerOptions": {
    "allowJs": true,
    "checkJs": true
}

9. removeComments

是否删除注释，默认值：false

10. noEmit

不对代码进行编译，默认值：false

11. sourceMap
当有错误时不生成js文件
是否生成sourceMap，默认值：false

以下语法检查选项

12. 严格检查
strict
启用所有的严格检查，默认值为true，设置后相当于开启了所有的严格检查
alwaysStrict
总是以严格模式对代码进行编译

noImplicitAny
禁止隐式的any类型

noImplicitThis
禁止类型不明确的this

strictBindCallApply
严格检查bind、call和apply的参数列表

strictFunctionTypes
严格检查函数的类型

strictNullChecks
严格的空值检查

strictPropertyInitialization
严格检查属性是否初始化

13. 额外检查

noFallthroughCasesInSwitch
检查switch语句包含正确的break

noImplicitReturns
检查函数没有隐式的返回值

noUnusedLocals
检查未使用的局部变量

noUnusedParameters
检查未使用的参数

14. 高级

allowUnreachableCode
检查不可达代码 , 可选值：
true，忽略不可达代码
false，不可达代码将引起错误

noEmitOnError
有错误的情况下不进行编译，默认值：false

最终版配置完如下

最后

以上就是端庄煎饼为你收集整理的TS第二天 Typesrcipt编译自动编译tsconfig.json配置选项的全部内容，希望文章能够帮你解决TS第二天 Typesrcipt编译自动编译tsconfig.json配置选项所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。