1、安装

cnpm install quill-image-resize-module -S    //改变大小
cnpm install quill-image-drop-module -S     //拖拽

2、引入main

import VueQuillEditor from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

3、在vue.config.js中添加

const webpack = require('webpack');
module.exports={
plugins: [
      new webpack.ProvidePlugin({
        'window.Quill': 'quill/dist/quill.js',
        'Quill': 'quill/dist/quill.js'
      })
    ],
  }

4、在页面的editorOption中的module添加

//当前页面引入
import ImageResize from 'quill-image-resize-module' // 引用，调整图片大小
Quill.register('modules/imageResize', ImageResize)

 editorOption: {
        placeholder: "",
        theme: "snow", // or 'bubble'
        modules: {
          toolbar: {
            container: toolbarOptions,
            handlers: {
              image: function(value) {
                if (value) {
                  // 触发input框选择图片文件
                  document.querySelector(".avatar-uploader1 input").click();
                } else {
                  this.quill.format("image", false);
                }
              },
              upload: value => {
                if (value) {
                  document.querySelector(".uploadFile input").click();
                }
              }
            }
          },
          //添加的
            imageResize: {
						displayStyles: {
							backgroundColor: 'black',
							border: 'none',
							color: 'white'
						},
						modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
					},
        }
      },