5、TS_编译选项

生成 tsconfig.json 文件

使用 tsc -init 会生成 tsconfig.json 文件，这时候 在终端输入 tsc 变可以对整个项目进行ts编译

tsconfig.json是ts编译器的配置文件，ts编译器可以根据它的信息来对代码进行编译

注：正常json文件是不允许写注释的，但是 tsconfig.json 文件可以写

tsconfig.json 的配置项

路径 ** 表示任意目录， * 表示任意文件
./src/**/* 表示任意src目录下的任意目录的任意文件

//tsconfig.json

// include  用来指定哪些ts文件需要被编译
  "include":[
    "./src/**/*"
  ]
  
 //exclude  不需要被编译的文件目录
  "exclude":["./src/hello/**/*"]
  

compilerOptions 编译器的选项

1、target （用来指定ts被编译成的 ES 版本）

默认值："ES3" (因为老的版本兼容性比较好)
可选值： 'es3', 'es5', 'es6', 'es2015', 'es2016', 'es2017', 'es2018', 'es20 19', 'es2020', 'es2021', 'es2022', 'esnext'

 "compilerOptions":{
    "target":"ES3"
  }
  
编译前的app.ts 文件
const a = 3;
let b = 5;

编译后的app.ts 文件
var a = 3;
var b = 5;

如果 "target":"ES6" 的话

 "compilerOptions":{

    // target  用来指定ts被编译成的 ES 版本
    "target":"ES6"
  }
  
编译前的app.ts 文件
const a = 3;
let b = 5;

编译后的app.js 文件
const a = 3;
let b = 5;

2、module （指定要使用的模块化的规范）

可选值： 'none', 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', 'es20 20', 'es2022', 'esnext', 'node16', 'nodenext'

  //  compilerOptions 编译器的选项
  "compilerOptions":{
    "module":"es2015"
  }
  
  编译前的文件
  //a.ts
  export const name = "cao.you.you";
  
  //b.ts
  import { name } from "./a";
  
  编译后的文件
  //a.js
  export const name = "cao.you.you";
  
  //b.js
  export {};
  

由于 b.ts 文件中引入了 name，但没有使用，所以编译后直接 忽视了

3、lib（指定项目中要使用的库）

可选值： 'es5', 'es6', 'es2015', 'es7', 'es2016', 'es2017', 'es2018', 'es201 9', 'es2020', 'es2021', 'es2022', 'es2023', 'esnext', 'dom', 'dom.iterable', 'webworker', 'webworker.importscripts', 'webworker.iterable', ' scripthost', 'es2015.core', 'es2015.collection', 'es2015.generator', 'es2015.iterable', 'es2015.promise', 'es2015.proxy', 'es2015.reflect', 'es2015.symbol', 'es2015.symbol.wellknown', 'es2016.array.include', 'es2017.date', 'es2017.object', 'es2017.sharedmemory', 'es2017.string', 'es2017.intl', 'es2017.typedarrays', 'es2018.asyncgenerator', 'es2018.asynciterable', 'es2018.intl', 'es2018.promise', 'es2018.regexp', 'es2 019.array', 'es2019.object', 'es2019.string', 'es2019.symbol', 'es2019.intl', 'es2020.bigint', 'es2020.date', 'es2020.promise', 'es2020.shar edmemory', 'es2020.string', 'es2020.symbol.wellknown', 'es2020.intl', 'es2020.number', 'es2021.promise', 'es2021.string', 'es2021.weakref', 'es2021.intl', 'es2022.array', 'es2022.error', 'es2022.intl', 'es2022.object', 'es2022.sharedmemory', 'es2022.string', 'es2022.regexp', 'es2 023.array', 'es2023.collection', 'esnext.array', 'esnext.collection', 'esnext.symbol', 'esnext.asynciterable', 'esnext.intl', 'esnext.dispos able', 'esnext.bigint', 'esnext.string', 'esnext.promise', 'esnext.weakref', 'esnext.decorators', 'decorators', 'decorators.legacy'

 //  compilerOptions 编译器的选项
  "compilerOptions":{
    "lib":[]
  }
  
  如果声明了lib，但只写一个空数组，则表示什么库都不用。这个时候 document 这个库就不会获得ts提示，如果想要提示，则像下面这样写
  "lib":["dom"]
 

4、outDir （指定编译后文件所在的目录）

//  compilerOptions 编译器的选项
  "compilerOptions":{
    "outDir":"./dist"
  }

这时候 编译后的文件将都自动放在和src同目录的 dist 文件下