本文介绍如何安装依赖和导入 IM UIKit 的组件。

IM UIKit 当前不支持 H5 界面搭建，仅支持 Web 浏览器界面搭建。

环境要求

• React 建议使用版本： 16.8.0 < 建议版本 < React 18.0.0
• React DOM 建议使用版本： React DOM 16.8.0 < 建议版本 < React DOM 18.0.0

安装依赖

目前仅支持 npm 方式集成，暂不支持 CDN 方式集成。

$ npm install @xkit-yx/im-kit-ui --save

导入组件

在 React 项目中按需导入组件：

tsximport {
  Provider, // 全局上下文
  ConversationContainer, // 会话列表组件
  ChatContainer, // 聊天（会话消息）组件
  AddContainer, // 搜索——添加按钮组件
  SearchContainer, // 搜索——搜索组件
  ContactListContainer, // 通讯录——通讯录导航组件
  ContactInfoContainer, // 通讯录——通讯录详情组件，包含好友列表、群组列表以及黑名单列表
  MyAvatarContainer, // 用户资料组件
} from '@xkit-yx/im-kit-ui'

//如果您希望引入组件 css：
import "@xkit-yx/im-kit-ui/es/style/css";
//如果您希望引入组件 less：
import "@xkit-yx/im-kit-ui/es/style";

建议引入组件的 css 或 less（两者选其一）。