ReScript、TypeScript:找不到模块“@rescript/react/src/ReactDOM.gen”或其相应的类型声明
ReScript, TypeScript: Cannot find module '@rescript/react/src/ReactDOM.gen' or its corresponding type declarations
我正在逐步将 React to TypeScript 的应用程序重写为 ReScript。
我已经在 ReScript 中实现了几个组件,但这是第一个,我将 ReactDOM.Style.t
用作我的组件的 属性。
这是我最小化的组件代码:
@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"
谢谢。
这是因为 GenType 没有附带 react 绑定,所以如果你需要它,你必须自己输入 (cf the docs to import types):
@genType.import(("react", "CSSProperties"))
type reactStyle = ReactDOM.Style.t
@genType
@react.component
let make = (~sx: option<reactStyle>=?) => {
<div></div>
}
这应该有效。
我正在逐步将 React to TypeScript 的应用程序重写为 ReScript。
我已经在 ReScript 中实现了几个组件,但这是第一个,我将 ReactDOM.Style.t
用作我的组件的 属性。
这是我最小化的组件代码:
@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"
谢谢。
这是因为 GenType 没有附带 react 绑定,所以如果你需要它,你必须自己输入 (cf the docs to import types):
@genType.import(("react", "CSSProperties"))
type reactStyle = ReactDOM.Style.t
@genType
@react.component
let make = (~sx: option<reactStyle>=?) => {
<div></div>
}
这应该有效。