search

chenjuneking / quill-image-drop-and-paste

A quill editor module for drop and paste image, with a callback hook before insert image into the editor
ISC License
105 stars 44 forks source link

Script tag file not working #6

Closed gigi199596 closed 4 years ago

gigi199596 commented 4 years ago

Hey, Nice plugin mate :)

I actually tried to use it with the script tag and fall into an error with your demo. To fix it I changed line 31 by: var ImageDropAndPaste = exports.ImageDropAndPaste = function() { and removed the line 105: exports.default=ImageDropAndPaste; lines numbers are after pretty printing the file.

I just did that by comparing to the other drop and paste plugin and fixed the problem. So I would like to know why because I don't have much knowledge of React and Vue 😄

Hope it helps,

Gilles

chenjuneking commented 4 years ago

Hey, Nice plugin mate :)

I actually tried to use it with the script tag and fall into an error with your demo. To fix it I changed line 31 by: var ImageDropAndPaste = exports.ImageDropAndPaste = function() { and removed the line 105: exports.default=ImageDropAndPaste; lines numbers are after pretty printing the file.

I just did that by comparing to the other drop and paste plugin and fixed the problem. So I would like to know why because I don't have much knowledge of React and Vue 😄

Hope it helps,

Gilles

Thanks for your report, @gigi199596 . I use babel.js to compile ES6 source code to ES5.

On ES6: expoet default class ImageDropAndPaste { }

will be compiled to ES5 like this: exports.default = ImageDropAndPaste;

when write into a script tag version of js file: quill-image-drop-and-paste.min.js, I insert some code both on the top and end: (function(){var exports={}; MINIFIED_JS window.Quill.register('modules/imageDropAndPaste',exports.ImageDropAndPaste)})(); which MINIFIED_JS should be replaced by the compiled code.

that error must comes from the end part: window.Quill.register('modules/imageDropAndPaste',exports.ImageDropAndPaste)})();

it should be window.Quill.register('modules/imageDropAndPaste',exports.default)})();

I had fixed it and regenerate a new version of quill-image-drop-and-paste.min.js, let me know if you still have questions.