TypeScript 第五天,TypeScript的编译选项(二)

60 阅读2分钟

files

files表示文件列表,只有我们编译的TS文件比较少时才会使用。下面我们来看一个例子

"files": [
    "aaa.ts",
    "bbb.ts",
    "ccc.ts",
  ]

列表中的文件都会被TS编译器所编译 默认值 files的默认值是[]。也就是说如果不指定就为空。

compilerOptions

compilerOptions是编译选项是配置文件中非常重要也比较复杂的配置选项,接下来我们详细看看里面的配置:

target

target设置ts代码编译的目标版本,那么他可以有哪些值呢?

可选值

  • ES3(默认)、ES5、ES6/ES2015、ES7/ES2016、ES2017、ES2018、ES2019、ES2020、ESNext 接下来我们看一个配置示例:
"compilerOptions": {
        "target": "ES2017", 
 }

lib

lib是指定代码运行时所包含的库(宿主环境)。他也有默认值,我们看下面:

默认值 lib的默认值是[] 那么他的可选项是什么呢?

lib的可选项是:'es5', 'es6', 'es2015', 'es7', 'es2016', 'es2017', 'es2018', 'es2019', 'es2020', 'es2021', 'es2022', 'es2023', 'es2024', 'esnext', 'dom', 'dom.iterable', 'dom.asynciterable', 'webworker', 'webworker.importscripts', 'webworker.iterable', 'webworker.asynciterable', 'scripthost', 'es2015.core', 'es2015.collection', 'es2015.generator', 'es2015.iterable', 'es2015.promise', 'es2015.proxy', 'es2015.reflect', 'es2015.symbol', 'es2015.symbol.wellknown', 'es2016.array.include', 'es2016.intl', 'es2017.arraybuffer', 'es2017.date', 'es2017.object', 'es2017.sharedmemory', 'es2017.string', 'es2017.intl', 'es2017.typedarrays', 'es2018.asyncgenerator', 'es2018.asynciterable', 'es2018.intl', 'es2018.promise', 'es2018.regexp', 'es2019.array', 'es2019.object', 'es2019.string', 'es2019.symbol', 'es2019.intl', 'es2020.bigint', 'es2020.date', 'es2020.promise', 'es2020.sharedmemory', '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.string', 'es2022.regexp', 'es2023.array', 'es2023.collection', 'es2023.intl', 'es2024.arraybuffer', 'es2024.collection', 'es2024.object', 'es2024.promise', 'es2024.regexp', 'es2024.sharedmemory', 'es2024.string', 'esnext.array', 'esnext.collection', 'esnext.symbol', 'esnext.asynciterable', 'esnext.intl', 'esnext.disposable', 'esnext.bigint', 'esnext.string', 'esnext.promise', 'esnext.weakref', 'esnext.decorators', 'esnext.object', 'esnext.regexp', 'esnext.iterator', 'esnext.float16', 'decorators', 'decorators.legacy'

我们看一个示例:

"compilerOptions": {
    "lib": ["ES6", "DOM"],
}

module

module设置编译后代码使用的模块化系统,他也是有默认值的,如下:

默认值 none 当然也有可选值了,可选值: CommonJS、UMD、AMD、System、ES2020、ESNext、None。下面我们来看一个示例:

"compilerOptions": {
    "module": "CommonJS"
}

outDir

outDir表示编译后文件的所在目录,下面我们来看一个示例:

"compilerOptions": {
    "outDir": "dist"
}

默认值

  • 默认情况下,编译后的js文件会和ts文件位于相同的目录,设置outDir后可以改变编译后文件的位置

outFile

outFile是将所有的文件编译为一个js文件,示例如下:

 "compilerOptions": {
       "outFile": "dist/app.js"
 }

默认值 默认会将所有的编写在全局作用域中的代码合并为一个js文件,如果module制定了None、System或AMD则会将模块一起合并到文件之中

rootDir

rootDir指的是指定代码的根目录,默认情况下编译后文件的目录结构会以最长的公共目录为根目录,通过rootDir可以手动指定根目录,我们来看下面例子

"compilerOptions": {
    "rootDir": "./src"
}

allowJs

allowJs指的是:是否对js文件编译 默认值 默认值是false

checkJs

checkJs是否对js文件进行检查,默认值是false

removeComments

removeComments是否删除注释,默认值是false

noEmit

noEmit不对代码进行编译,默认值是false

sourceMap

sourceMap 是否生成sourceMap,默认值是:false

好了今天就先写到这里,我们明天见,感谢大家 明天给大家写严格检查相关的字段设置......