# 核心功能

- Human documentation: [https://docs.univer.ai/zh-CN/guides/boards/features/core](https://docs.univer.ai/zh-CN/guides/boards/features/core)

- Agent Markdown: [https://docs.univer.ai/zh-CN/guides/boards/features/core.md](https://docs.univer.ai/zh-CN/guides/boards/features/core.md)

- Requested language: `zh-CN`

- Content language: `zh-CN`

- Documentation version: `1.0.0-rc.0`

- Source: [boards/features/core/index.zh-CN.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/boards/features/core/index.zh-CN.mdx)

---

#### Package metadata

```json
{
  "preset": [],
  "plugins": [
    {
      "client": "@univerjs-pro/boards",
      "facade": "@univerjs-pro/boards/facade"
    },
    {
      "client": "@univerjs-pro/boards-ui",
      "locale": "@univerjs-pro/boards-ui/locale/zh-CN",
      "style": "@univerjs-pro/boards-ui/lib/index.css",
      "facade": "@univerjs-pro/boards-ui/facade"
    }
  ],
  "license": true,
  "server": false
}
```

Univer Boards 核心功能将页面与元素模型和交互式浏览器画布组合在一起。模型和 UI 由两个 Web SDK 包提供，并作为独立的 `UNIVER_BOARD` 单元运行。

## 功能

* **页面与元素顺序**：页面存储在 `pages` 中，可绘制对象存储在每个页面的 `elements` 中，两个层级都使用显式顺序数组。
* **画布元素**：处理文本、形状、图片、连接线、组、容器和泳道。
* **命令驱动的编辑**：让元素变更、顺序和父子关系统一经过命令层，并提供权限及可选历史记录和协同集成所需的挂钩。
* **浏览器画布**：渲染元素，并提供选择、变换、剪贴板、文本编辑、视口控制和面板功能。
* **可扩展适配器**：添加表格、思维导图、图表、资源、打印和交换等可选 Boards 能力。
* **持久化**：创建、恢复和保存包含页面、资源、主题与活动页面状态的 `IBoardData` 快照。

## 预设模式

Univer Boards 目前没有专用预设。模型和浏览器 UI 都应使用插件模式。

## 插件模式

### 安装

在[安装与基础使用](https://docs.univer.ai/zh-CN/guides/boards/getting-started/installation.md)介绍的 Univer 运行时中加入两个 Boards 产品包：

#### npm

```bash
npm install @univerjs-pro/boards @univerjs-pro/boards-ui
```

#### pnpm

```bash
pnpm add @univerjs-pro/boards @univerjs-pro/boards-ui
```

#### yarn

```bash
yarn add @univerjs-pro/boards @univerjs-pro/boards-ui
```

#### bun

```bash
bun add @univerjs-pro/boards @univerjs-pro/boards-ui
```

### 注册产品插件

按照安装指南先注册共享的渲染、文档、绘图、墨迹、形状编辑依赖和 许可证，再注册 Boards 插件：

```ts
import { UniverBoardsPlugin } from '@univerjs-pro/boards'
import { UniverBoardsUIPlugin } from '@univerjs-pro/boards-ui'

import '@univerjs-pro/boards-ui/lib/index.css'

univer.registerPlugin(UniverBoardsPlugin)
univer.registerPlugin(UniverBoardsUIPlugin)
```

`UniverBoardsPlugin` 注册 Board 模型、命令、元素服务、适配器和权限。`UniverBoardsUIPlugin` 添加渲染画布与浏览器交互。
