◆

tsconfig target 编译属性详解

2023-02-02 01:370

作用

指定输出代码的 ECMAScript 目标版本 "ES3"(默认)

可选版本

es3、es5、es6、es2015、es2016、es2017、es2018、es2019、es2020、es2021、es2022、esnext

  • 其中 es6 就是 es2015
  • 然后后续的 es2016 对应的就是 es7 依次类推, es2019 对应 es10
  • esnext: 一个动态的概念,指的是 ECMAScript 的下一个版本,指当前最新发布的版本没有包含。

编译示例

拿最简单的 ES5 以及 ES6 举例

const a = 8;

ES5 编译结果如下

'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var a = 8;

ES6 编译结果如下

const a = 1;
export {};

测试一下可选链操作符(es2020 提供)

const a = {
  name: 'fnn',
  age: 18,
};

const b = a?.age;

当我们采用 ES6 输出时

const a = {
  name: 'fnn',
  age: 18,
};
const b = a === null || a === void 0 ? void 0 : a.age;
export {};

当我们将 target 设置为 es2020,可以发现输出并没有被转换

const a = {
  name: 'fnn',
  age: 18,
};
const b = a?.age;
export {};

总结

设置 target 为什么版本要取决于当前开发的项目需要兼容到什么版本的浏览器(浏览器对 ES 兼容到哪一个版本),所以不能轻易的设置为 esnext,以及其他新的版本。

💬留言板0

还没有留言,来发表第一条吧~

PAGE LOAD / LIVEtsconfig target 编译属性详解加载中