Ts —— 文件编译有那些配置项

文章目录

• 前言
• 一、监视模式
• 二、配置文件基础
• 三、编译器选项
• 总结

---

第一节：监视模式

tsc xxx.ts -w  仅能监视一个文件 监视模式 ts已改就会编译js,只要保存就会自动编译。

第二节：配置文件基础

上面的命令仅能监视一个文件，需要监视整个目录和配置就需要使用配置文件tsc命令去执行。

3.2.1 根目录创建配置文件

新建tsconfig.json文件。执行命令 tsc -w 可监视整个目录，会自动编译ts文件

3.2.2 include配置

{

     /* include包含文件：哪些包含的文件需要编译 */

     /* ** 任意目录 * 任意文件 */

    "include":[

        "./src/**/*"

     ]

}

3.2.3 exclude配置

定义哪些目录不需要编译。

"exclude":[

          "./src/hello/**/*"

]

一般可以不指定 默认值是：["node_modules","bower_compontends","jspm_packages"]

3.2.4 extends继承

extends:"./configs/base",继承某个配置文件。

3.2.5 files指定编译文件

列出编译ts文件列表。

files:[

   "xx.ts","xxx.ts"

]

第三节：编译器选项compilerOptions

编译器选项，一个复杂的配置包含了很多子选项，对我们的ts文件编译内容的配置。

3.3.1 target目标

编译ES编译的目标版本，默认是ES3.

"compilerOptions":{

       "target":"ES6"

}

3.3.2 module模块

指定模块化的一个规范。

"module":"ES2015"

3.3.3 lib

指定项目中使用的库，一般情况下不需要修改。

 "lib":["es6","dom"]

3.3.4 outDir

编译后的文件 所在的目录。

"outDir":"./dist"

3.3.5 outFile

将全局作用域下的代码合并为一个文件(很少用)

"outFile":"./dist/app.js"

模块化的时候 module改为 system

3.3.6 allowJs编译js

是否对js文件进行编译，默认为false

"allowJs":false,

3.3.7 checkJs规范

是否检查js代码符合语法规范。 默认不检查

"checkJs":false,

Hello.js  写如下代码 若为true会检查js的规范。

let a=10;

a = "string";

console.log(a);

3.3.8 removeComment注释

编译的时候不需要对注释进行编译。

"removeComments":true,

3.3.9 noEmit不生成编译文件

"noEmit":true //不生成编译后的文件(用的几率很少)

3.3.10 noEmitOnError

"noEmitOnError":true,//有错误的时候不生成编译后的文件

3.3.11 alwaysStrict严格模式

"alwaysStrict":true

3.3.12 anoImplicitAny

"noImplicitAny":true //不允许隐式的any类型。

3.3.13 anoImplicitThis

"noImplicitThis":true,// 不允许不明确的this

3.3.14 strictNullChecks

"strictNullChecks":true //严格的检查控制

let obj = document.getElementById("box1");

obj?.addEventListener('click',()=>{

})

3.3.15 strict打开所有的严格检查

"strict":true