quill-plugin-image-upload

A plugin for uploading image in Quill 🌇

• 🌟 upload a image when it is inserted, and then replace the base64-url with a http-url
• 🌟 preview the image which is uploading with a loading animation
• 🌟 when the image is uploading, we can keep editing the content including changing the image's position or even delete the image.

Install

npm install quill-plugin-image-upload --save

Start

import Quill from 'quill';
import 'quill/dist/quill.snow.css';
import imageUpload from 'quill-plugin-image-upload';

// register quill-plugin-image-upload
Quill.register('modules/imageUpload', imageUpload);

new Quill('#editor', {
  theme: 'snow',
  modules: {
    toolbar: [
     'image'
    ],
    imageUpload: {
      upload: file => {
        // return a Promise that resolves in a link to the uploaded image
        return new Promise((resolve, reject) => {
          ajax().then(data => resolve(data.imageUrl));
        });
      }
    },
  },
});

Demo

cd demo
npm install
npm start