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