开始使用

genType 与 ReScript 编译器紧密集成，只需要很少的设置即可使用。

安装

通过 npm（或 yarn）安装二进制文件：

npm install gentype --save-dev

# Verify installed gentype binary
npx gentype --help

注意：版本要求 / 兼容性列表可以在这里找到

添加 gentypeconfig 到你的 bsconfig.json 中 (更多细节请看配置):

"gentypeconfig": {
    "language": "typescript",
    "shims": {},
    "generatedFileExtension": ".gen.tsx",
    "module": "es6",
    "debug": {
      "all": false,
      "basic": false
    }
}

如果要通过 npm 工作流使用 ReScript 运行 genType，不需要在 package.json 中进行特殊设置。

注意：rescript 将自动检测你安装的 genType 版本。

配置

每个 genType 驱动的项目都需要一个位于 bsconfig.json 顶层的配置项 "gentypeconfig"。配置结构如下：

JS
  //...
  "gentypeconfig": {
    "language": "typescript" | "flow" | "untyped",
    "generatedFileExtension": ".gen.tsx",
    "module": "es6" | "commonjs",
    "shims": {
      "ReasonReact": "ReactShim"
    }
  }

• generatedFileExtension

  • 生成文件的扩展名 (默认为 .gen.tsx)

• language

  • "typescript" : 生成 TypeScript 的 *.gen.tsx 文件。

  • "flow": 生成带有 Flow 类型注解的 *.gen.js 文件。

  • "untyped": 生成普通 JavaScript 的 *.gen.js 文件。

• module

  • 生成的 *.gen.tsx 文件的模块格式 (支持 "es6" 和 "commonjs")

• shims

  • 当无法修改源代码添加注解（例如导出 ReScript 的 list），而又需要将某些基本 ReScript 数据类型导出到 JS，并且这些类型在 genType 中不是一等公民时，才需要此项。

  • 例如： Array<string> 格式为： "RescriptModule=JavaScriptModule"

添加 Shims (TS & Flow)

shim 是一个 TS / Flow 文件，包含用户定义的库类型。

在 bsconfig.json 的 "gentypeconfig" 中配置你的 shim 文件，并将相关的 .shims.js 文件添加到 ReScript 可见的目录中，例如 src/shims/，可以在这里找到导出 ReactEvent 的示例shim 文件。

测试是否生效

打开相关的 *.res 文件，并将 @genType 注解添加到要被 JavaScript 使用的任何绑定/值/函数，如果被注解的值使用一个类型，这个类型也必须被注解。请看例子 Hooks.res

保存文件并运行 npm run bs:build 或类似命令来重新构建，你现在应该看到一个具有相同名称的 *.gen.tsx（用于 TypeScript），或 *.gen.js （用于 Flow）文件（例如 MyComponent.res -> MyComponent.gen.tsx）。

然后，从 MyComponent.res 导出的任何值都可以从 JS 导入。例如：

JS
import MyComponent from "./components/MyComponent.gen";

示例

我们准备了一些例子，让你了解如何在你的项目中集成 genType。查看下面项目的 README。

请确保先构建 genType，再尝试构建示例。

• typescript-react-example

• flow-react-example

• untyped-react-example

实验性特性

这些特性仅用于实验。它们随时可能被更改/删除，而不会被认为是 breaking changes。

• 将对象和记录类型导出为接口。要激活此特性，请将 "exportInterfaces": true 添加到配置中。类型会从 name 被重命名为 Iname

• 为非类型化后端发送 prop 类型。要激活此特性，请将 "propTypes": true 和 "language": "untyped" 添加到配置中

限制

• in-source = true 目前仅支持配置了 in-source 生成 和 .bs.js 文件后缀的 ReScript 项目。

• 有限的命名空间支持 目前只有有限的 namespace 支持，并且只有 namespace: true 是可行的，而不是 namespace: "custom" 之类配置。

更新日志

查看 Changes.md 以获取每个版本的特性、修复和更改的完整列表。