Question

我正在努力在Create React App应用程序中为react-load-script添加类型声明。

在src文件夹中，我创建了一个react-load-script.d.ts文件并添加了以下内容：

// Type definitions for React Load Script

declare module 'react-load-script' {
  import * as React from 'react'
  interface Script {
    url: string
  }
}

以上所述，我得到了错误：

JSX元素类型“脚本”没有任何构造或调用签名。

我要去哪里错了？这是模块：https://github.com/blueberryapps/react-load-script

这是我目前在应用程序中的使用方式：

<Script url="https://maps.googleapis.com/maps/api/js?                               key=your_api_key&libraries=places"          
    />

我还需要为onLoad添加类型：

<Script url="https://maps.googleapis.com/maps/api/js?                               key=your_api_key&libraries=places"          
      onLoad={this.handleScriptLoad}        
    />

非常感谢。

根据评论更新

我移动了声明文件并将其重命名为/@types/react-load-script/index.d.ts

在tsconfig.json中，我向compilerOptions添加了以下内容：

"typeRoots": ["./node_modules/@types", "./@types"]

这是index.d.ts的全部内容：

// Type definitions for React Load Script
import React from 'react'

export interface ScriptProps {
  url: string
  onLoad: () => void
  // etc...
}

export default class Script extends React.Component<ScriptProps> {}

与此同时，我仍然收到错误消息：

找不到模块'react-load-script'的声明文件。 '/用户/sb/git/fl-app/node_modules/react-load-script/lib/index.js' 隐式地具有“ any”类型。

Answer 1

这是因为var myvar = mapOf("x" to 0.000001, "y" to 0.00000023) for((k, v) in myvar){ println(v) } //Its showing the result 1.0E-6 2.3E-7是组件，但是您的界面定义了Script。

在lib sources之后，您可能需要执行以下操作：

props

评论后编辑

您的类型涉及第三方模块。您必须为此建议打字稿。为此，您可以将类型封装在模块声明中，如下所示：

export interface ScriptProps {
  url: string;
  onLoad: () => void;
  // etc...
}

export default class Script extends React.Component<ScriptProps> {}

Answer 2

注意：在项目的根目录下创建一个名为“custom-types”的文件夹，并在其中创建文件“index.d.ts”

index.d.ts

declare module 'your-module-that-has-no-types';

tsconfig.json

{
  "compilerOptions": {
    // ...other props,
    "typeRoots": ["./custom-types", "node_modules/@types"]
  },
  "include": [
    "src"
, "custom-types/index.d.ts"  ],
}

在Create React App中为节点模块添加自定义Typescript类型声明

2 个答案: