TNotes.react

Appearance

to top

0036. 快速搭建一个基于 vite、antd 的 react 项目 ​

1. 🔗 antd 官方文档 - 在 vite 中使用 antd ​

2. 📒 使用 pnpm 实现安装和初始化的流程 ​

bash
# 1. 快速创建一个 vite 项目
$ pnpm create vite
# 创建项目所需的参数，根据命令行提示来配置即可。

# 2. 安装 antd
pnpm install antd --save

3. 💻 demos.1 - 测试按钮组件的使用 ​

  • 可根据实际需求，删除掉一些默认的样式或者 icon，比如 src/App.css、src/index.css 等。
  • 修改 src/App.js，引入 antd 的按钮组件。
js
import React from 'react';
import { Button } from 'antd';

const App = () => (
  <div className="App">
    <Button type="primary">Button</Button>
  </div>
);

export default App;
  • 如果你能看到页面上已经有了 antd 的蓝色按钮组件，接下来就可以继续选用其他组件开发应用了。