quill Invalid Quill container

quill Invalid Quill container #editor,VUE中出现此类问题执行模块拆分即可解决。

resolved

Module split:

TextEditor.vue

<template>
  <div id="editor"></div>
</template>
<script>
import Quill from "quill";
import $ from "jquery";

export default {
 props: {
  content: String
 },
 mounted() {
    var toolbarOptions = [
      ["bold", "italic", "underline", "strike"], // toggled buttons
      ["blockquote", "code-block"],
      [{ header: 1 }, { header: 2 }], // custom button values
      [{ list: "ordered" }, { list: "bullet" }],
      [{ script: "sub" }, { script: "super" }], // superscript/subscript
      [{ indent: "-1" }, { indent: "+1" }], // outdent/indent
      [{ direction: "rtl" }], // text direction
      [{ size: ["small", false, "large", "huge"] }], // custom dropdown
      [{ header: [1, 2, 3, 4, 5, 6, false] }],
      [{ color: [] }, { background: [] }], // dropdown with defaults from theme
      [{ font: [] }],
      [{ align: [] }],
      ["link", "image", "video", "formula"],
      ["clean"] // remove formatting button
    ];
      var editor = new Quill("#editor", {
         modules: { toolbar: toolbarOptions },
     theme: "snow"
    });
    let Image = Quill.import("formats/image");
    let Video = Quill.import("formats/video");
    Quill.register(Image, true);
    Quill.register(Video, true);
    //editor.root.innerHTML=this.content;
   }
  };
  </script>
  <style src="@/plugins/css/quill.snow.css"></style>

 <el-form-item label="内容" prop="newsContent">

     <TextEditor v-bind:content="form.newsContent" />

 </el-form-item>