1.自动编译单个文件
在终端中输入tsc app.ts -w
进入到监视模式
当app.ts文件内容发生变化时,其生成的app.js也会自动编译
2.自动编译整个项目
在项目中创建文件tsconfig.json
在终端中输入tsc -w
进入到监视模式
当项目中的ts文件内容发生变化时,其对应的js文件也会自动编译
3.tsconfig.json的配置选项
tsconfig.json是ts编译器的配置文件,ts编译器可以根据它的信息来对代码进行编译
include: 用来指定哪些ts文件需要被编译,如以下形式:
"include": [
"./src/**/*"
],
其中**表示任意目录,*表示任意文件
exclude: 指定不需要被编译的文件目录,如以下形式:
"exclude": [
"./src/hello/**/*"
],
extends: 定义被继承的配置文件,如以下形式:
"extends":"./config/base",
files: 指定被编译文件的列表,只在有需要编译的文件时才会用到,如以下形式:
"files":[
"cors.ts",
"types.ts"
],
compilerOptions编译选项
编译选项是配置文件中非常重要也比较复杂的配置选项,在compilerOptions中包含多个子选项,用来完成对编译的配置
target: 用来指定ts被编译为ES的版本
可选值为:‘es3’, ‘es5’, ‘es6’, ‘es2015’, ‘es2016’, ‘es2017’,‘es2018’, ‘es2019’, ‘es2020’, ‘es2021’, ‘es2022’, ‘esnext’
"target": "es2015",
module: 指定要使用的模块化的规范
可选值为:‘none’, ‘commonjs’, ‘amd’, ‘system’, ‘umd’, ‘es6’, ‘es2015’, ‘es2020’, ‘es2022’, ‘esnext’, ‘node16’, ‘nodenext’
"module": "es2015",
lib: 用来指定项目中要使用的库,一般情况下不需要动
"lib": [
"es6",
"dom"
]
outDir: 用来指定编译后文件所在的目录
"outDir": "./dist",
outFile: 将代码合并为一个文件
"outFile": "./dist/app.js",
设置outFile后,所有的全局作用域中的代码会合并到同一个文件中
如果合并两个模块,需要将module设置为 amd 或 system
"module": "system",
allowJs: 是否对js文件进行编译,默认是false
"allowJs": true,
checkJs: 是否检查js代码是否符合语法规范(TS语法规范),默认是false
"checkJs": true,
removeComments: 是否移除注释,默认是false
"removeComments": true,
noEmit: 不生成编译后的文件,默认是false
"noEmit": true,
noEmitOnError: 当有错误时不生成编译后的文件,默认是false
"noEmitOnError": true,
alwaysStrict: 用来设置编译后的文件是否使用严格模式,默认是false
"alwaysStrict": true,
noImplicitAny: 不允许使用隐式的any类型,默认是false
"noImplicitAny": true,
noImplicitThis: 不允许使用不明确类型的this,默认是false
"noImplicitThis": true,
strictNullChecks: 严格地检查空值,默认是false
"strictNullChecks": true,
strict: 所有严格检查的总开关,默认是false
"strict": true,
tsconfig.json整体结构
{
"include": [
"./src/**/*"
],
"compilerOptions": {
"target": "es2015",
"module": "es2015",
// "lib": [
// "es6",
// "dom"
// ],
"outDir": "./dist",
// "outFile": "./dist/app.js",
"allowJs": true,
"checkJs": true,
"removeComments": true,
"noEmit": false,
"noEmitOnError": true,
"strict": true,
"alwaysStrict": true,
"noImplicitAny": true,
"noImplicitThis": true,
"strictNullChecks": true,
}
}