javascript - 重新编写,TypeScript : Cannot find module '@rescript/react/src/ReactDOM.gen' or its corresponding type declarations

标签 javascript reactjs typescript reason rescript

我正在逐渐将使用 React to TypeScript 的应用程序重写为 ReScript。
我已经在 ReScript 中实现了一些组件,但这是第一个,我使用 ReactDOM.Style.t作为我的组件的属性(property)。
这是我最小化的组件代码:

@genType
@react.component
let make = (~sx: option<ReactDOM.Style.t>=?) => {
  <div></div>
}
ReScript 编译良好(除了未使用 sx 的警告,但我们可以忽略它)。
我有以下 bs.js生成,这似乎很好:
// Generated by ReScript, PLEASE EDIT WITH CARE

import * as React from "react";

function InhypedIcon(Props) {
  return React.createElement("div", undefined);
}

var make = InhypedIcon;

export {
  make ,

}
/* react Not a pure module */
和下面对应的.gen.tsx文件,这会导致问题:
/* TypeScript file generated from InhypedIcon.res by genType. */
/* eslint-disable import/first */


import * as React from 'react';

// @ts-ignore: Implicit any on import
import * as InhypedIconBS__Es6Import from './InhypedIcon.bs';
const InhypedIconBS: any = InhypedIconBS__Es6Import;

import type {Style_t as ReactDOM_Style_t} from '@rescript/react/src/ReactDOM.gen';

// tslint:disable-next-line:interface-over-type-literal
export type Props = { readonly sx?: ReactDOM_Style_t };

export const make: React.ComponentType<{ readonly sx?: ReactDOM_Style_t }> = InhypedIconBS.make;
这不编译,我收到 TypeScript 错误:
TypeScript error in /app/src/icons/InhypedIcon.gen.tsx(11,48):
Cannot find module '@rescript/react/src/ReactDOM.gen' or its corresponding type declarations.  TS2307

     9 | const InhypedIconBS: any = InhypedIconBS__Es6Import;
    10 |
  > 11 | import type {Style_t as ReactDOM_Style_t} from '@rescript/react/src/ReactDOM.gen';
       |                                                ^
    12 |
    13 | // tslint:disable-next-line:interface-over-type-literal
    14 | export type Props = { readonly sx?: ReactDOM_Style_t };

我明白,TS 找不到 rescript/react/src/ReactDOM.gen ,但是我真的不知道为什么。
有什么想法可以解决这个问题吗?
我的包版本:
node: v16.6.2

"typescript": "^4.1.2"
"rescript": "^9.1.4"
"@rescript/react": "^0.10.3"
谢谢你。

最佳答案

这是因为用于响应的 rescript 绑定(bind)不随 GenType 一起提供,因此如果您需要它,您必须自己键入它(参见 the docs to import types):

@genType.import(("react", "CSSProperties"))
type reactStyle = ReactDOM.Style.t

@genType
@react.component
let make = (~sx: option<reactStyle>=?) => {
  <div></div>
}
这应该有效。

关于javascript - 重新编写,TypeScript : Cannot find module '@rescript/react/src/ReactDOM.gen' or its corresponding type declarations,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70428873/

相关文章:

javascript - jQuery.get() 回调中的数据为空

reactjs - 钩子(Hook)等同于 componentWilLReceiveProps 来更新状态

javascript - 使用 react-autoBind 时 ReactJs setState 未定义

node.js - NestJS - 无法将服务注入(inject)订阅者

javascript - 响应式(Reactive)表单不更新表单字段 Angular 7 中的值

javascript - 悬停在图像 map 上时颜色反转

javascript - 当特定选项是唯一存在的选项时,在特定选项上显示隐藏文本框将不起作用

typescript - 使用严格的空检查处理 Typescript 2.0 中的数组移位返回类型

javascript - 无法读取 null 的属性 'cloneNode',但当脚本位于 HTML 上时有效

json - 无法在 React 应用程序中访问来自 Express 服务器的响应数据