Jelajahi Sumber

fix: 在main.js入口挂载window.Quill解决import提升导致的resize模块报错

Developer 2 minggu lalu
induk
melakukan
de77fd87e9
3 mengubah file dengan 6 tambahan dan 3 penghapusan
  1. TEMPAT SAMPAH
      dist.zip
  2. 1 3
      src/components/editor/index.vue
  3. 5 0
      src/main.js

TEMPAT SAMPAH
dist.zip


+ 1 - 3
src/components/editor/index.vue

@@ -16,9 +16,7 @@ import {
     quillEditor,
     Quill
 } from 'vue-quill-editor'
-// quill-image-resize-module 内部通过 window.Quill.imports.parchment 访问 Parchment,
-// webpack 打包后 window.Quill 未挂载会报错,需先赋值再引入。
-window.Quill = Quill
+// window.Quill 已在 main.js 入口处挂载,避免 webpack import 提升导致 resize 模块执行时 window.Quill 仍为 undefined。
 import ImageResize from 'quill-image-resize-module'
 Quill.register('modules/imageResize', ImageResize)
 // Quill 1.3.6 的 ui/icons.js 不含 undo/redo,需手动注入到全局 icons 映射,

+ 5 - 0
src/main.js

@@ -21,6 +21,11 @@ import cropperDlg2 from '@/components/cropperDlg/index2.vue'
 import { hasPermission, getDictLabel } from '@/utils'
 import cloneDeep from 'lodash/cloneDeep'
 
+// quill-image-resize-module 内部直接访问 window.Quill.imports.parchment,
+// 在 webpack 打包环境下 window.Quill 未挂载会报错。必须在入口处尽早挂载。
+import { Quill as VueQuill } from 'vue-quill-editor'
+window.Quill = VueQuill
+
 import VueCropper from 'vue-cropper'
 Vue.use(VueCropper)
 Vue.component('cropperDlg', cropperDlg)