阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      Ant Design 在 TypeScript 中使用

      初始化

      使用 create-react-app 一步步地创建一个 TypeScript 项目,并引入 antd

      antd 基于最新稳定版本的 TypeScript,请确保项目中使用匹配的版本。

      新项目

      npx create-react-app my-app --template typescript
      

      添加到已有项目

      npm install --save typescript @types/node @types/react @types/react-dom @types/jest
      

      引入 antd

      $ npm install antd
      $ yarn add antd
      

      使用

      修改 src/App.tsx,引入 antd 的按钮组件。

      import React, { FC } from 'react';
      import { Button } from 'antd';
      import './App.css';
      
      const App: FC = () => (
        <div className="App">
          <Button type="primary">Button</Button>
        </div>
      );
      
      export default App;
      

      修改 src/App.css,在文件顶部引入 antd 的样式。

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

      重新启动 yarn start,现在你应该能看到页面上已经有了 antd 的蓝色按钮组件,接下来就可以继续选用其他组件开发应用了。

      卖前端学习教程

      只需几十元,就能买到培训班的内部教程!开启高薪之路!

      零基础小白阿里P7的教程都有!

      同时长期收购所有培训班的前端教程

      目录
      目录