Maofeng
49 lines
1.1 KiB
Plaintext
49 lines
1.1 KiB
Plaintext
---
|
||
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 或通知系统。
|