Midway-React-SSRUI 组件
midway-react-ssr 默认集成了 Ant Design UI组件库，你可以删除它换成以下其它的组件库。
Ant Design
Ant Design ，是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。
安装
sh
pnpm add antd
1
引入
tsx
import React, { FC } from 'react';
import { Button } from 'antd';
import 'antd/dist/antd.css';
const App: FC = () => (
<div className="App">
<Button type="primary">Button</Button>
</div>
);
export default App;
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
Tdesign React
鹅厂优质 UI 组件，配套工具完整，设计工整，文档清晰。
安装
sh
pnpm add tdesign-react
1
引入
tsx
import React, { FC } from 'react';
import { Button } from 'tdesign-react';
import 'tdesign-react/es/style/index.css'; // 少量公共样式
const App: FC = () => (
<div className="App">
<Button type="primary">Button</Button>
</div>
);
export default App;
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
Arco Design React
字节跳动 UI 组件库开源，大厂逻辑，设计文档完美。
安装
sh
pnpm add @arco-design/web-react
1
引入
tsx
import React, { FC } from 'react';
import { Button } from "@arco-design/web-react";
import "@arco-design/web-react/dist/css/arco.css";
const App: FC = () => (
<div className="App">
<Button type="primary">Button</Button>
</div>
);
export default App;
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
Vant
有赞团队开源，并由社区团队维护，轻量、可靠的移动端 React 组件库。
安装
sh
pnpm add react-vant
1
引入
tsx
import React, { FC } from 'react';
import { Button } from 'react-vant';
const App: FC = () => (
<div className="App">
<Button type="primary">Button</Button>
</div>
);
export default App;
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10