TypeScript

Oxc transformer 支持将 TypeScript 转换为 JavaScript。

🌐 Oxc transformer supports transforming TypeScript to JavaScript.

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 规范保持一致。

🌐 By default, TypeScript removes unused imports in a different semantics than the JavaScript specification. The verbatimModuleSyntax option tells TypeScript to align with the JavaScript specification.

如果你使用此选项，请确保将 typescript.onlyRemoveTypeImports 选项设置为 true。

🌐 If you are using this option, make sure to set typescript.onlyRemoveTypeImports option to true.

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 used to have a different semantics for class fields than the JavaScript specification. The useDefineForClassFields option tells TypeScript to align with the JavaScript specification. This options is enabled by default if the target option in the tsconfig is set to es2022 or higher.

如果你要禁用此选项，请确保将 typescript.removeClassFieldsWithoutInitializer 选项设置为 true，并将 assumptions.setPublicClassFields 设置为 true。

🌐 If you are disabling this option, make sure to set typescript.removeClassFieldsWithoutInitializer option and assumptions.setPublicClassFields to true.

import { transform } from "oxc-transform";

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

装饰器

🌐 Decorators

Oxc 转换器支持转换传统装饰器。这在 TypeScript 中被称为实验性装饰器。

🌐 Oxc transformer supports transforming legacy decorators. This is called experimental decorators in TypeScript.

如果你在 tsconfig 中使用 experimentalDecorators 选项，你可以使用 decorators.legacy 选项。 如果你在 tsconfig 中使用 emitDecoratorMetadata 选项，你可以使用 decorators.emitDecoratorMetadata 选项。

🌐 If you are using the experimentalDecorators option in the tsconfig, you can use the decorators.legacy option. If you are using the emitDecoratorMetadata option in the tsconfig, you can use the decorators.emitDecoratorMetadata option.

import { transform } from "oxc-transform";

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

装饰器元数据：需要类型推断的类型将回退到 Object

由于缺乏完整的类型推断功能，如果 Oxc 转换器无法计算装饰器元数据的类型，它将回退到 Object 类型。

🌐 Due to the lack of full type inference feature, Oxc transformer will fallback to Object type if it cannot calculate the type of the decorator metadata.

例如，以下代码将被转换为以下代码：

🌐 For example, the following code will be transformed to the following code:

input.ts

import { Something1 } from "./somewhere";

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

export class Foo {
  @test
  foo(input1: Something1, input2: Something2) {}
}

output(oxc).js

// omit helper functions
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,
);

output(typescript_compiler).js

// omit helper functions
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 的行为是一致的。

🌐 This behavior aligns with TypeScript's behavior when using a type that is external.

多伦多证券交易所

🌐 TSX

TSX 文件的转换也受支持。有关更多信息，请参见 JSX 转换。

🌐 Transforming TSX files is supported as well. See JSX transform for more information.

重写导入扩展

🌐 Rewriting import extensions

如果你在 tsconfig 中使用 rewriteImportExtensions 选项，则可以使用 typescript.rewriteImportExtensions 选项。

🌐 If you are using the rewriteImportExtensions option in the tsconfig, you can use the typescript.rewriteImportExtensions option.

import { transform } from "oxc-transform";

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

注意事项

🌐 Caveats

因为 Oxc 转换器会独立转换每个文件，所以某些 TypeScript 特性不被支持。为了避免使用不受支持的特性，你应该在你的 tsconfig.json 文件中启用 isolatedModules 选项。

🌐 Because Oxc transformer transforms each files independently, some TypeScript features are not supported. To avoid using unsupported features, you should enable the isolatedModules option in your tsconfig.json file.