npm package: @gulibs/prosemirror-plugin-media
Description: > Prosemirror 插件，增加视频、图片、音频支持
Author: HectorGu
Latest version: 0.2.5

# prosemirror-plugin-media

> Prosemirror 插件，增加视频、图片、音频支持

[![NPM](https://img.shields.io/npm/v/@gulibs/prosemirror-plugin-media.svg)](https://www.npmjs.com/package/@gulibs/prosemirror-plugin-media) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save @gulibs/prosemirror-plugin-media
```

or

```bash
yarn add @gulibs/prosemirror-plugin-media
```

## Usage

如果不知道怎么添加插件可以查看官网文档。示例代码是根据

```tsx
import React from 'react';
import { Card } from 'antd';
import { ProseMirrorEditor, EditorToolBar } from '@gulibs/react-prosemirror-editor-x';
import { images, videos, audios } from '@gulibs/prosemirror-plugin-media';

class Example extends React.Component {
    render() {
        return (
            <ProseMirrorEditor
                config={{
                    schema,
                    plugins: [
                        images('insert', {
                                modalOptions: {
                                    title: '添加图片',
                                    buttonText: '上传图片',
                                    description: '支持jpg、jpeg、png、gif等多种格式，单张图片最大支持20MB'
                                },
                                data: {
                                    tid: currentUser.id
                                },
                                action: '/api/yftc/top/files/upload',
                            }),
                            audios('insert', {
                                modalOptions: {
                                    title: '添加音频',
                                    buttonText: '上传音频',
                                    description: '支持mp3、ogg、wav等多种格式，单个音频最大支持20MB'
                                },
                                data: {
                                    tid: currentUser.id
                                },
                                action: '/api/yftc/top/files/upload',
                            }),
                            videos('insert', {
                                tooltip: {
                                    title: '插入视频',
                                    placement: 'bottom'
                                },
                                modalOptions: {
                                    title: '添加视频',
                                    buttonText: '上传视频',
                                    description: '支持mp4、webm、ogg等多种格式，单张图片最大支持100MB'
                                },
                                data: {
                                    tid: currentUser.id
                                },
                                action: '/api/yftc/top/files/upload',
                            })
                    ]
                }}
                autoFocus
                onRender={({ editor }) => (
                    <Card
                    type="inner"
                    bordered={false}
                    >
                    <EditorToolBar menus={menus} />
                    {editor}
                    </Card>
                )}
                >
            </ProseMirrorEditor>
        )
    }
}
```

## License

MIT © [AnizGu](https://github.com/AnizGu)