module es2022

TL;DR

コンパイラオプション moduleで es2022 が指定できるようになった。メジャーな機能は「top-level await」。

moduleとは何ぞ

tsconfig.jsonまたは --module *** オプションで指定ができる。

tsconfig.json

"module": "es2022"

module とは、どのようなモジュールパターンの環境で使われるかを指定するもの。 指定によってトランスパイル後のJavaScriptに変化が生じる。

module:"es2022"

import { valueOfPi } from "./constants";
export const twoPi = valueOfPi * 2;

module:"CommonJS"

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.twoPi = void 0;
const constants_1 = require("./constants");
exports.twoPi = constants_1.valueOfPi * 2;

module:"umd"

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "./constants"], factory);
    }

参考： https://qiita.com/hareku/items/dbf0752aa76499a895fd

今回のアップデートで module に es2022 が指定できるようになった。

top-level awaitを使ってみる

module:es2022 を設定するとtop-level awaitが使える。

module:es2020 など古いバージョンではtop-level awaitは使えない。