antd 在反应应用程序中但无法编译答案

【问题标题】：antd in react app but failed to compileantd 在反应应用程序中但无法编译
【发布时间】：2018-08-07 16:14:42
【问题描述】：

antd 教程在 typescript 中的使用

创建反应应用...好的
yarn add antd ...ok
在App.css中导入antd.css ...ok

但是我遇到了这个错误信息

D:/8VSCode/vcjoo-ant/src/App.tsx
(16,10): Type '{ shape: "circle"; icon: string; }' is not assignable to type '(IntrinsicAttributes & IntrinsicClassAttributes<Button> & Pick<Readonly<{ children?: ReactNode; }> & Readonly<AnchorButtonProps> & Pick<InferProps<{ type: any; shape: any; size: any; htmlType: any; ... 4 more ...; block: any; }>, "htmlType">, "color" | ... 258 more ... | "htmlType"> & Partial<...> & Partial<...>) | ...'.
  Type '{ shape: "circle"; icon: string; }' is not assignable to type 'Pick<Readonly<{ children?: ReactNode; }> & Readonly<NativeButtonProps> & Pick<InferProps<{ type: any; shape: any; size: any; htmlType: any; onClick: any; loading: any; className: any; icon: any; block: any; }>, "htmlType">, "color" | ... 262 more ... | "value">'.
    Property 'htmlType' is missing in type '{ shape: "circle"; icon: string; }'.

我可以在 antd 中使用 to {InputNumber} 组件但是，我不能 {Button} 组件，因为有一些这个错误

我的错误是什么？

App.tsx

import { InputNumber, Button } from 'antd';
import * as React from 'react';
import './App.css';

import logo from './logo.svg';

class App extends React.Component {
  public render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to React</h1>
        </header>
        <InputNumber min={1} max={10} defaultValue={3} />
        <Button shape="circle" icon="search" />
        <p className="App">
          To get started, edit <code>src/App.tsx</code> and save to reload.
        </p>

      </div>
    );
  }
}

export default App;

App.css

 @import '~antd/dist/antd.css';

    .App {
      text-align: center;
    }
...

【问题讨论】：

我在组件中添加了 args，例如“ 所以，我可以使用到组件！！但是..我遇到了另一个错误 [ ts] 类型 ...

标签： reactjs typescript antd

【解决方案1】：

使用命令npm install @types/module_name下载模块

或在 [*.d.ts] 文件中声明模块，如下所述

【讨论】：

【解决方案2】：

好的，我解决了！

首先，你 add to " declare module 'antd' " 在 [*.d.ts] 文件中（例如：./images.d.ts）

并添加到“htmlType”元素比如..<Button type="primary" htmlType="">Primary</Button>

Typescript 是强大的代码！因此，您可以使用新模块而不是必须添加到 [*.d.ts] 中的模块

我需要你对这个错误的建议那是谢谢

【讨论】：

【解决方案3】：

感谢@Chun-Joo Park

在 [*.d.ts] 文件中添加“声明模块 'antd'”（例如：./images.d.ts）

为我工作，然后重新启动我的应用程序

yarn start

【讨论】：