Skip to content

Quill custom Uploader, supports images, videos, and attachments, with customizable loading indicators.

Notifications You must be signed in to change notification settings

mudoo/quill-uploader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

3bffa50 · Feb 11, 2025

History

10 Commits
Feb 11, 2025
Feb 11, 2025
Feb 11, 2025
Dec 12, 2024
Dec 12, 2024
Dec 12, 2024
Dec 12, 2024
Dec 12, 2024
Dec 16, 2024
Feb 11, 2025
Dec 12, 2024
Dec 12, 2024

Repository files navigation

Quill2 Uploader Module

loading finish

Usage

import Quill from 'quill'
import 'quill/dist/quill.snow.css'

import CustomUploader from 'quill-uploader'
import attachmentIcon from 'quill/assets/icons/attachment.svg?raw'

// replace iframe video to native video tag
import Video from 'quill-formats-video'

Quill.register(Video, true)
Quill.register('modules/customUploader', CustomUploader)

const Icons = Quill.import('ui/icons')
Icons.attachment = attachmentIcon

new Quill('#editor', {
  theme: 'snow',
  modules: {
    toolbar: {
      handlers: {
        // handle attachment
        attachment: true
      }
    },
    uploader: {
      // call customUploader
      handler (range, files) {
        return this.quill.customUploader?.uploadFiles(range, files)
      }
    },
    customUploader: {
      accepts: {
        image: ['image/jpeg', 'image/png']
      },
      imagePreload: true, // Preload image when insert to editor after uploaded
      focusOnDone: false,
      handler: null,
      // upload
      upload: async (_range, files, callback) => {
        const results = await uploadFiles(files)

        // each file callback
        // callback(error?, fileResult)

        return results
      }
    }
  }
})

About

Quill custom Uploader, supports images, videos, and attachments, with customizable loading indicators.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published