Oxc

TypeScript ​

Oxc transformer は、TypeScript を JavaScript に変換する機能をサポートしています。

js
import { transform } from "oxc-transform";

const result = await transform("lib.ts", sourceCode, {
  typescript: {
    jsxPragma: "React.createElement",
    jsxPragmaFrag: "React.Fragment",
    onlyRemoveTypeImports: false,
    allowNamespaces: true,
    removeClassFieldsWithoutInitializer: false,
    rewriteImportExtensions: false,
  },
});

verbatimModuleSyntax ​

デフォルトでは、TypeScript は JavaScript の仕様とは異なるセマンティクスで未使用のインポートを削除します。
verbatimModuleSyntax オプションは、TypeScript が JavaScript の仕様と一致するようにするためのものです。

このオプションを使用する場合は、typescript.onlyRemoveTypeImports オプションを true に設定する必要があります。

js
import { transform } from "oxc-transform";

const result = await transform("lib.ts", sourceCode, {
  typescript: {
    onlyRemoveTypeImports: true,
  },
});

useDefineForClassFields ​

TypeScript はかつて、クラスフィールドについて、JavaScript の仕様とは異なるセマンティクスを持っていました。 useDefineForClassFields オプションは、TypeScript が JavaScript の仕様に合わせるようにするものです。 このオプションは、tsconfig における target オプションが es2022 以上に設定されている場合、デフォルトで有効になっています。

このオプションを無効にする場合、typescript.removeClassFieldsWithoutInitializer オプションおよび assumptions.setPublicClassFields が true に設定されていることを確認してください。

js
import { transform } from "oxc-transform";

const result = await transform("lib.ts", sourceCode, {
  typescript: {
    removeClassFieldsWithoutInitializer: true,
  },
  assumptions: {
    setPublicClassFields: true,
  },
});

デコレータ ​

Oxc transformer はレガシーデコレータの変換をサポートしています。これは TypeScript において「実験的デコレータ」と呼ばれます。

tsconfig で experimentalDecorators オプションを使用している場合、decorators.legacy オプションを利用できます。
また、tsconfig で emitDecoratorMetadata オプションを使用している場合、decorators.emitDecoratorMetadata オプションを利用できます。

js
import { transform } from "oxc-transform";

const result = await transform("lib.ts", sourceCode, {
  decorators: {
    legacy: true,
    emitDecoratorMetadata: true,
  },
});

デコレータメタデータ：型推論が必要な型は Object にフォールバックされます

完全な型推論機能の欠如により、デコレータメタデータの型を計算できない場合、Oxc transformer は Object 型にフォールバックします。

たとえば、以下のコードは次のようになります：

ts
import { Something1 } from "./somewhere";

type Something2 = Exclude<string | number, string>;

export class Foo {
  @test
  foo(input1: Something1, input2: Something2) {}
}
js
// ヘルパー関数を省略
import { Something1 } from "./somewhere";
var _ref;
export class Foo {
  foo(input1, input2) {}
}
_decorate(
  [
    test,
    _decorateMetadata("design:type", Function),
    _decorateMetadata("design:paramtypes", [
      typeof (_ref = typeof Something1 !== "undefined" && Something1) === "function"
        ? _ref
        : Object,
      Object, 
    ]),
    _decorateMetadata("design:returntype", void 0),
  ],
  Foo.prototype,
  "foo",
  null,
);
js
// ヘルパー関数を省略
var _a;
import { Something1 } from "./somewhere";
export class Foo {
  foo(input1, input2) {}
}
__decorate(
  [
    test,
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [
      typeof (_a = typeof Something1 !== "undefined" && Something1) === "function" ? _a : Object,
      Number, 
    ]),
    __metadata("design:returntype", void 0),
  ],
  Foo.prototype,
  "foo",
  null,
);

この振る舞いは、外部の型を使用する場合の TypeScript の動作と一致しています。

明示的に型を設定するには、Reflect.metadata を呼び出すことができます：

ts
import { Something1 } from "./somewhere";

type Something2 = Exclude<string | number, string>;

export class Foo {
  @test
  @Reflect.metadata("design:paramtypes", [Something1, Number])
  foo(input1: Something1, input2: Something2) {}
}
js
// ヘルパー関数を省略
import { Something1 } from "./somewhere";
var _ref;
export class Foo {
  foo(input1, input2) {}
}
_decorate(
  [
    test,
    Reflect.metadata("design:paramtypes", [Something1, Number]),
    _decorateMetadata("design:type", Function),
    _decorateMetadata("design:paramtypes", [
      typeof (_ref = typeof Something1 !== "undefined" && Something1) === "function"
        ? _ref
        : Object,
      Object,
    ]),
    _decorateMetadata("design:returntype", void 0),
  ],
  Foo.prototype,
  "foo",
  null,
);

TSX ​

TSX ファイルの変換もサポートされています。詳細については JSX 変換 を参照してください。

インポート拡張子の書き換え ​

tsconfig で rewriteImportExtensions オプションを使用している場合、typescript.rewriteImportExtensions オプションを利用できます。

js
import { transform } from "oxc-transform";

const result = await transform("lib.ts", sourceCode, {
  typescript: {
    rewriteImportExtensions: "rewrite", // または "remove"
  },
});

注意点 ​

隔離モジュール ​

Oxc transformer は各ファイルを独立して変換するため、一部の TypeScript 機能はサポートされていません。
サポートされていない機能を使用しないようにするには、tsconfig.json ファイルで isolatedModules オプションを有効にする必要があります。

名前空間の部分的サポート ​

TypeScript には古い機能として 名前空間 があります。新しいプロジェクトでは ES モジュールの使用が推奨されています が、Oxc transformer は名前空間に対して部分的なサポートを行っています。

var または let を使用した変数のエクスポートはサポートされません ​

var または let で宣言された変数のエクスポートはサポートされません。

ts
namespace Foo {
  export let bar = 1; 
}
console.log(Foo.bar);

回避策として const を使用してください。変数を変更可能にしたい場合は、内部の可変性を持つオブジェクトを使用します：

ts
namespace Foo {
  export const bar = { value: 1 }; 
}
console.log(Foo.bar.value);

同じ名前の名前空間間でスコープを共有しません ​

ts
namespace Foo {
  export const bar = 1;
}
namespace Foo {
  export const baz = bar;
}
js
let foo;
(function (_Foo) {
  const bar = (_Foo.bar = 1);
})(Foo || (Foo = {}));
(function (_Foo2) {
  const baz = (_Foo2.baz = bar); 
})(Foo || (Foo = {}));
js
var Foo;
(function (Foo) {
  Foo.bar = 1;
})(Foo || (Foo = {}));
(function (Foo) {
  Foo.baz = Foo.bar; 
})(Foo || (Foo = {}));

この例では、TypeScript コンパイラ出力では、2 番目の名前空間内の bar 参照は最初の名前空間の bar 変数を指していますが、Oxc transformer 出力ではそうではありません。

回避策として、名前空間オブジェクト経由で明示的に参照するようにします：

ts
namespace Foo {
  export const bar = 1;
}
namespace Foo {
  export const baz = Foo.bar; 
}

© 2026 VoidZero Inc. および Oxc 貢献者。