2.学习TypeScript 编译选项配置

发布于:2024-12-20 ⋅ 阅读:(147) ⋅ 点赞:(0)

自动编译

我们可以使用 tsc ...../.ts -w 命令进行ts文件的自动编译

 

执行后 编译会持续侦听 自动编译 

这种方式只能侦听一个文件 对做项目肯定是不现实的,为了解决这个问题,我们需要添加一个tsconfig.json文件,写入一个基础对象

再有tsconfig.json的前提下,我们可以在目录的终端使用 tsc 命令 一键编译目录下的所有文件,同时也可以使用tsc -w 同时侦听所有ts文件的变化并编译

tsconfig.json就是我们typescript的配置文件 我们的配置全部需要写在这个配置文件之中。

tsconfig.json基础配置

include

用来指定哪些ts文件需要被编译

**表示任意目录 *表示任意文件

  "include": [
    "./src/**/*" //表示根目录下的任意目录的任意文件都会被编译  **表示任意目录 *表示任意文件
  ],

exclude

用来指定哪些ts文件不需要编译

  "compilerOptions": {
    //编译器的选项
    // target 用来指定ts编译为js的版本
    "target": "ES6"
  }

  "exclude": [
    "./src/reject/**/*" // 表示src下面的reject目录中的文件都不编译
  ],

extends

继承其他文件中的配置

files

指定需要编译的文件,只有需要编译的文件较少时使用 与includes相似但麻烦

compilerOptions 常用编译器选项

target

target用来指定ts文件编译为js文件的版本 默认转换为es3

  "compilerOptions": {
    //编译器的选项
    // target 用来指定ts编译为js的版本
    "target": "ES6"
  }

在es6版本使用let定义一个变量 变为js文件后就不会变成var了。

可取值为所有的js版本,写错了编译会报错,并且会提示,所以我们可以随便写一个错误的 然后就知道有什么版本了

module

指定使用模块化规范,不同的模块化编译成的js代码是完全不同的 一般使用es6版本

我们新建一个m.ts文件 导出一个变量并且在index中引入 并且使用它

commonjs 

es6

可选值也可以通过错误的报错得到

 lib

库 用来指定我们项目中使用的库,一般情况下不需要修改

可取值 瞎写咯

outDir 

用来指定编译后js文件所放的目录

我们配置一个"./dist"

删除掉之前的js文件后 会发现自动创建了一个dist目录 并且将编译文件放入了 

 

 outFile

将代码合并为一个js文件中

我们将模块化的代码暂时去掉 只定义简单的变量

 

有模块化使用并且需要合并代码的时候, 模块化规范只能选择system和cmd 否则会报错

 


网站公告

今日签到

点亮在社区的每一天
去签到