tsconfig.json配置说明

配置 tsconfig.json

tsconfig.json 所包含的属性并不多,只有 7 个,ms 官方也给出了它的定义文件。但看起来并不怎么舒服,这里就翻译整理一下。(若有误,还请指出)

  • files: 数组类型,用于表示由 ts 管理的文件的具体文件路径
  • exclude: 数组类型,用于表示 ts 排除的文件(2.0 以上支持 Glob)
  • include: 数组类型,用于表示 ts 管理的文件(2.0 以上)
  • compileOnSave: 布尔类型,用于 IDE 保存时是否生成编译后的文件
  • extends: 字符串类型,用于继承 ts 配置,2.1 版本后支持
  • compilerOptions: 对象类型,设置编译的选项,不设置则使用默认配置,配置项比较多,后面再列
  • typeAcquisition: 对象类型,设置自动引入库类型定义文件(.d.ts)相关,该对象下面有 3 个子属性分别是:
    • enable: 布尔类型,是否开启自动引入库类型定义文件(.d.ts),默认为 false
    • include: 数组类型,允许自动引入的库名,如:["jquery", "lodash"]
    • exculde: 数组类型,排除的库名

如不设定 files 和 include,ts 默认是 exclude 以外的所有的以 .ts 和 .tsx 结尾的文件。如果,同时设置 files 的优先级最高,exclude 次之,include 最低。

上面都是文件相关的,编译相关的都是靠 compilerOptions 设置的,接着就来看一看。

属性名 值类型 默认值 描述
allowJs boolean false 编译时,允许有 js 文件
allowSyntheticDefaultImports boolean module === "system" 允许引入没有默认导出的模块
allowUnreachableCode boolean false 允许覆盖不到的代码
allowUnusedLabels boolean false 允许未使用的标签
alwaysStrict boolean false 严格模式,为每个文件添加 "use strict"
baseUrl string   与 path 一同定义模块查找的路径,详细参考这里
charset string "utf8" 输入文件的编码类型
checkJs boolean false 验证 js 文件,与 allowJs 一同使用
declaration boolean false 生成 .d.ts 定义文件
declarationDir string   生成定义文件的存放文件夹(2.0 以上)
diagnostics boolean false 是否显示诊断信息
downlevelIteration boolean false 当 target 为 ES5 或 ES3 时,提供对 for..of,解构等的支持
emitBOM boolean false 在输出文件头添加 utf-8 (BOM)字节标记
emitDecoratorMetadata boolean false 详见 issue
experimentalDecorators boolean false 允许注解语法
forceConsistentCasingInFileNames boolean false 不允许不同变量来代表同一文件
importHelpers   boolean false 引入帮助(2.1 以上)
inlineSourceMap boolean false 将 source map 一同生成到输出文件中
inlineSources boolean false 将 ts 源码生成到 source map 中,需要同时设置 inlineSourceMap 或 sourceMap
isolatedModules boolean false 将每个文件作为单独的模块
jsx string "preserve" jsx 的编译方式
jsxFactory string "React.createElement" 定义 jsx 工厂方法,React.createElement 还是 h(2.1 以上)
lib string[]   引入库定义文件,可以是["es5", "es6", "es2015", "es7", "es2016", "es2017", "esnext", "dom", "dom.iterable", "webworker", "scripthost", "es2015.core", "es2015.collection", "es2015.generator", "es2015.iterable", "es2015.promise", "es2015.proxy", "es2015.reflect", "es2015.symbol", "es2015.symbol.wellknown", "es2016.array.include", "es2017.object", "es2017.sharedmemory", "esnext.asynciterable"](2.0 以上)
listEmittedFiles boolean false 显示输入文件名
listFiles boolean false 显示编译输出文件名
locale string 随系统 错误信息的语言
mapRoot string   定义 source map 的存放位置
maxNodeModuleJsDepth number 0 检查引入 js 模块的深度,需同 allowJs 一同使用
module string   指定模块生成方式,["commonjs", "amd", "umd", "system", "es6", "es2015", "esnext", "none"]
moduleResolution string   指定模块解析方式,["classic" : "node"]
newLine string 随系统 行位换行符,"crlf" (windows) 或 "lf" (unix)
noEmit boolean false 不显示输出
noEmitHelpers boolean false 不在输出文件中生成帮助
noEmitOnError boolean false 出错后,不输出文件
noFallthroughCasesInSwitch boolean false switch 语句中,每个 case 都要有 break
noImplicitAny boolean false 不允许隐式 any
noImplicitReturns boolean false 函数所有路径都必须有显示 return
noImplicitThis boolean false 不允许 this 为隐式 any
noImplicitUseStrict boolean false 输出中不添加 "use strict"
noLib boolean false 不引入默认库文件
noResolve boolean false 不编译三斜杠或模块引入的文件
noUnusedLocals boolean false 未使用的本地变量将报错(2.0 以上)
noUnusedParameters boolean false 未使用的参数将报错(2.0 以上)
outDir string   定义输出文件的文件夹
outFile string   合并输出到一个文件
paths object   与 baseUrl 一同定义模块查找的路径,详细参考这里
preserveConstEnums boolean false 不去除枚举声明
pretty boolean false 美化错误信息
reactNamespace string "React" 废弃。改用jsxFactory
removeComments boolean false 去除注释
rootDir string 当前目录 定义输入文件根目录
rootDirs string []   定义输入文件根目录
skipDefaultLibCheck boolean false 废弃。改用 skipLibCheck
skipLibCheck boolean false 对库定义文件跳过类型检查(2.0 以上)
sourceMap boolean false 生成对应的 map 文件
sourceRoot string   调试时源码位置
strict boolean false 同时开启 alwaysStrictnoImplicitAnynoImplicitThis 和 strictNullChecks (2.3 以上)
strictNullChecks boolean false null 检查(2.0 以上)
stripInternal boolean false 不输出 JSDoc 注解
suppressExcessPropertyErrors boolean false 不提示对象外属性错误
suppressImplicitAnyIndexErrors boolean false 不提示对象索引隐式 any 的错误
target string "es3" 输出代码 ES 版本,可以是 ["es3", "es5", "es2015", "es2016", "es2017", "esnext"]
traceResolution boolean false 跟踪模块查找信息
typeRoots string []   定义文件的文件夹位置(2.0 以上)
types string []   设置引入的定义文件(2.0 以上)
watch boolean false 监听文件变更

一般情况下,tsconfig.json 文件只需配置 compilerOptions 部分。

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true, // 允许引入没有默认导出的模块
    "module": "es2015",
    "removeComments": true,
    "preserveConstEnums": true,
    "sourceMap": true,
    "strict": true,
    "target": "es5",
    "lib": [
      "dom",
      "es5",
      "es2015"
    ]
  }
}

其中,allowSyntheticDefaultImports 是使用 vue 必须的,而设置 module 则是让模块交由 webpack 处理,从而可以使用 webpack2 的摇树。另外,加上allowJs,这样就可以一点点将现有的 js 代码转换为 ts 代码了。

如果,你在 webpack 中设置过 resolve -> alias,那么,在 ts config 中也需要通过 baseUrl + path 的方式来定义模块查找的方式。

<a name="tslint"></a>

原文地址:https://www.cnblogs.com/cczlovexw/p/11527708.html

时间: 2024-10-07 17:23:39

tsconfig.json配置说明的相关文章

tsconfig.json

概述 如果一个目录下存在一个tsconfig.json文件,那么它意味着这个目录是TypeScript项目的根目录. tsconfig.json文件中指定了用来编译这个项目的根文件和编译选项. 一个项目可以通过以下方式之一来编译: 使用tsconfig.json 不带任何输入文件的情况下调用tsc,编译器会从当前目录开始去查找tsconfig.json文件,逐级向上搜索父目录. 不带任何输入文件的情况下调用tsc,且使用命令行参数--project(或-p)指定一个包含tsconfig.json

TypeScript的配置文件 tsconfig.json

//tsconfig.json指定了用来编译这个项目的根文件和编译选项 { "compilerOptions": { //compilerOptions:编译选项,可以被忽略,这时编译器会使用默认值 "allowSyntheticDefaultImports": true,//允许从没有设置默认导出的模块中默认导入.这并不影响代码的显示,仅为了类型检查. "baseUrl": "./src",//解析非相对模块名的基准目录 &

tsconfig.json ts配置文件解析

tsconfig.json ts配置文件解析 tsconfig 编译选项 示例配置: { "compilerOptions": { //指定生成哪个模块系统代码: "None", "CommonJS", "AMD", "System", "UMD", "ES6"或 "ES2015". "module": "common

nw.js node-webkit基本程序结构与配置package.json配置说明

(一)基本程序结构 如上图,是一个nw程序的基本组织结构,在根目录下有package.json(程序的配置文件)和index.html(可以是任意名称,应用的启动页面):js/css/resources分别是应用的样式.脚本.和资源文件(html.图片等):node_modules存放node.js的扩展组件.这只是一个通用的基本组织结构,实际项目的组织结构,不必一定按照此结构进行搭建,如项目使用的是js模块化编程require框架的.最终的组织结构以适应实际项目为准,但文件package.js

1.搭建Angular2项目

简述:搭建angular2的开发环境,网上已经有许多教程,不过都是window系统下的教程,我本人使用的是linux系统,搭建环境的过程也稍微比前者麻烦了一点. 1. pakeage.json配置文件:是用来声明项目中使用的模块,在部署环境时,只要在pakeage所在的目录执行npm install命令就可以安装所有需要的模块了. 新建一个文件夹作为项目的根目录,整个项目的文件都存放在这个文件夹下面.在根目录下创建一个package.json的配置文件,该文件描述了npm包的所有相关信息, 包括

编译TypeScript(TypeScript转JavaScript)

1.配置tsconfig.json文件 tsconfig.json文件配置说明 { "compilerOptions": { //生成相关说明,TypeScript编译器如何编译.ts文件. "module": "commonjs", //指定模块代码生成:"none"."commonjs"."amd"."system"."umd"."e

Egret学习-初次创建项目

最近无聊,好久没有写游戏了,决定学习下egret,主要原因:egret是h5框架,相比android和iPhone或cocos2dx来说不需要安装可以直接运行. 下面进入正题,开始学习egret 简单看了下官方文档, 1.需要安装引擎 EgretLauncher,版本号:1.1.4 安装引擎,5.2.4 2.安装开发工具 Egret Wing3,版本号4.1.6 3.创建项目,跟着官方文档就好 各文件夹功能说明 .wing:包括 Egret 项目的任务配置文件和启动配置文件. wingPrope

Angular 2基础(一) 环境搭建

Angular2是一款开源JavaScript库,由Google维护,用来创建页面应用程序.正式发布于2016年9月,基于ES6开发. 一.准备工作 使用Angular2开发,需要预先做一些配置上的配置,如NPM.Node.Js.Git等,还要对TypeScript有个大概的了解. a)NPM是随同NodeJS一起安装的包管理器,那应该类似NuGet的作用了.NPM集成在了NodeJS安装包,可以一起安装,在CMD输入npm –v和node –v可以验证是否已安装. b)TypeScript则是

angular踩坑之路:初探webpack

之前费了一番力气安装好了angular开发环境,后面的几天都是在angular中文官网上看文档,照着英雄教程一步一步操作,熟悉了angular的一些基本特性,这部分没有遇到什么大问题,还比较顺利.这两天在看官方文档中的Webpack简介,想跟着文档做一遍,了解一下如何用Webpack打包angular项目,结果遇到了一些问题,因为是初学angular和Webpack的小白,这些问题一时难以解决,花费了不少时间,想在这里记录一下. 首先跟着文档将相关的文件都添加到项目中,目录是这样子的: 根据文档