---
title: 安装与设置
description: 添加 Media、注册词典并连接存储 Adapter。
order: 10
toc:
  - id: add-the-package
    title: 添加包
  - id: register-styles-and-catalogs
    title: 注册样式与词典
  - id: provide-media
    title: 提供媒体能力
---

## 添加包 {#add-the-package}

在使用方应用中添加 Media：

```json
{
  "dependencies": {
    "@workspace/media": "workspace:*"
  }
}
```

## 注册样式与词典 {#register-styles-and-catalogs}

导入一次样式表，让 Tailwind 包含 Media 使用的工具类：

```css
@import "@workspace/media/globals.css";
```

将 `@workspace/media/locales/{locale}` 加入应用的国际化 catalog sources。

## 提供媒体能力 {#provide-media}

在需要共享存储行为和通知方式的媒体界面外统一挂载 Adapter：

```tsx
import { MediaLibrary, MediaProvider } from "@workspace/media"

;<MediaProvider adapter={mediaAdapter} notify={showNotice}>
  <MediaLibrary />
</MediaProvider>
```

可选的 `notify` 回调会把操作结果接入应用自己的 Toast 或通知系统。