当前位置：首页 > news >正文

TypeScript 编译配置

news 2025/8/27 23:28:28

TypeScript的编译配置：

对单独一个ts文件进行监听编译可使用tsc demo.ts -w
如果想对所有ts文件进行监听编译，监听到变化就自己编译，可以直接创建一个tsconfig.json文件。内容空着也OK：{}，执行 tsc 或 tsc -w
如果有相应的需求，可以在根目录下创建一个文件
tsconfig.json，在此文件中进行配置：

{/** tsconfig.json 是ts编译器的配置文件，ts编译器可以根据它的信息对代码进行编译* "include" 用来指定哪些ts文件需要被编译 * 	路径：** 表示任意目录* 		   * 表示任意文件* "exclude" 不需要被编译的文件目录* 	默认值：["node_modules"，"bower_components"，"jspm_packages"] * "extends" 定义被继承的配置文件 * "files" 指定被编译文件的列表 需要编译的文件少时可使用此选项* "compilerOptions" 编译器的选项* 	=======compilerOptions常用的配置项=======* 	"target" 用来指定ts被编译为ES的版本 具体值如下所示：* 	 es3,es5,es6,es2015,es2016,es2017,es2018,es2019,es2020,esnext* 	"module" 指定要使用的模块化的规范 值为以下所示：* 	none,commonjs,amd,syste,umd,es6,es2015,es2020,esnext* 	"lib" 用来指定项目中要使用的库 * 		如在node环境下，使用documen，可配置 一般不需要配置* 		(一般在浏览器运行，不需要处理) 可选值居多，dom,es6...* 	"outDir" 用来指定编译后文件所在的目录* 	"outFile" 将代码合并为一个文件  后期交给打包工具即可，只做了解* 		设置outFile后，所有全局作用域中的代码会合并到同一个文件中* 		注意:在想合并两个模块时，module要选择system/amd,否则会报错 * 		"module":"system" * 	"allowJs" 是否对js文件进行编译 默认为false* 	"checkJs" 是否检查js代码是否符合语法规范 默认为false* 	"removeComments" 是否移除注释 默认为false* 	"noEmit" 不生成编译后的文件 默认为false * 		若只想简单看下语法是否正确，不要编译后文件可写 noEmit:true* 	"noEmitOnError" 当有错误时不生成编译后的文件 * 		可避免有错误的代码编译到dist下文件中* 	=========compilerOptions 语法检查配置项===========* 	"strict" 所有严格检查的总开关* 	"alwaysStrict" 用来设置编译后的文件是否使用严格模式 默认为false	* 	"noImplicitAny" 不允许隐式的any类型 * 		如果设为true，代码中会对any类型的值进行提示* 	"noImplicitThis" 不允许不明确类型的this* 		可在代码中写function fn(this:Window){console.log(this)}* 			function fn(this:any){console.log(this)}	* 	"strictNullChecks" 严格的检查空值 * 		代码中可以写* 			let box1 = document.getElementByid('box1')* 			if(box1 !== null){* 				box1.addEventListener('click',function(){* 					console.log('hello')* 				})	* 			}* 			也可写为:* 				box1?..addEventListener('click',function(){* 					console.log('hello')* 				})	* */"include":["./src/**/*", // src目录下任意目录下的任意ts文件],"exclude":["./src/hi/**/*"],"extends":"./config/base" // 表示此配置文件会自动包含config文件下base.json中的配置信息"files": ["core.ts","tsc.ts"],"compilerOptions":{// 常用配置"target":"es2015", "module":"es2015",//"lib":["dom"],"outDir":"./dist","allowJs":true, "checkJs":false,"removeComments":true,"noEmit":false,"noEmitOnError":true,// 语法检查"strict":true,"alwaysStrict":true, // 如果有模块的引入时，文件会自动启用严格模式"noImplicitAny":true,"noImplicitThis":true,"strictNullChecks":true}
}

tsconfig.json 常用配置项：

“include” 用来指定哪些ts文件需要被编译
```
 路径：** 表示任意目录* 表示任意文件
```

“exclude” 不需要被编译的文件目录。

 默认值exclude：["node_modules"，"bower_components"，"jspm_packages"]

“extends” 定义被继承的配置文件
“files” 指定被编译文件的列表需要编译的文件少时可使用此选项

“compilerOptions” 编译器的选项

 ---------compilerOptions常用的配置项------"target" 用来指定ts被编译为ES的版本* 可选值如下：es3,es5,es6,es2015,es2016,es2017,es2018,es2019,es2020,esnext"module" 指定要使用的模块化的规范 值为以下所示：none,commonjs,amd,syste,umd,es6,es2015,es2020,esnext"lib" 用来指定项目中要使用的库 如在node环境下，使用documen，可配置 一般不需要配置(一般在浏览器运行，不需要处理) 可选值居多，dom,es6..."outDir" 用来指定编译后文件所在的目录"outFile" 将代码合并为一个文件  后期交给打包工具即可，只做了解设置outFile后，所有全局作用域中的代码会合并到同一个文件中注意:在想合并两个模块时，module要选择system/amd,否则会报错 "module":"system" "allowJs" 是否对js文件进行编译 默认为false"checkJs" 是否检查js代码是否符合语法规范 默认为false"removeComments" 是否移除注释 默认为false"noEmit" 不生成编译后的文件 默认为false 若只想简单看下语法是否正确，不要编译后文件可写 noEmit:true"noEmitOnError" 当有错误时不生成编译后的文件 可避免有错误的代码编译到dist下文件中-----compilerOptions 语法检查配置项----------"strict" 所有严格检查的总开关"alwaysStrict" 用来设置编译后的文件是否使用严格模式 默认为false	"noImplicitAny" 不允许隐式的any类型 如果设为true，代码中会对any类型的值进行提示"noImplicitThis" 不允许不明确类型的this可在代码中写function fn(this:Window){console.log(this)}function fn(this:any){console.log(this)}	"strictNullChecks" 严格的检查空值 代码中可以写let box1 = document.getElementByid('box1')if(box1 !== null){box1.addEventListener('click',function(){console.log('hello')})	}也可写为:box1?..addEventListener('click',function(){console.log('hello')})

可参考网址：tsconfig.json

查看全文

http://www.lryc.cn/news/113529.html