Merge pull request #241 from Nelwhix/patch-1

Updated Modules docs

Author: luthfi-hh

docs/content/guide/modules.md

@@ -41,6 +41,58 @@ export default defineComponent({
 })
 </script>
 ~~~
+## Example using quill-image-uploader
+In this example I am gonna use [quill-image-uploader](https://github.com/NoelOConnell/quill-image-uploader), A module for Quill rich text editor to allow images to be uploaded to a server instead of being base64 encoded.
+
+
+**Installation:**
+``` bash
+npm install quill-image-uploader --save
+```
+**Usage:**
+
+~~~ vue
+<template>
+  <QuillEditor :modules="modules" toolbar="full" />
+</template>
+
+<script>
+import { ref, defineComponent } from 'vue'
+import { QuillEditor } from '@vueup/vue-quill'
+import '@vueup/vue-quill/dist/vue-quill.snow.css'
+import ImageUploader from 'quill-image-uploader';
+import axios from '../lib/axios';
+
+export default defineComponent({
+  components: {
+    QuillEditor,
+  },
+  setup: () => {
+    const modules = {
+        name: 'imageUploader',
+        module: ImageUploader,
+        options: {
+          upload: file => {
+            return new Promise((resolve, reject) => {
+              const formData = new FormData();
+              formData.append("image", file);
+
+              axios.post('/upload-image', formData)
+              .then(res => {
+                console.log(res)
+                resolve(res.data.url);
+              })
+              .catch(err => {
+                reject("Upload failed");
+                console.error("Error:", err)
+              })
+            })
+          }
+    return { modules }
+  }
+})
+</script>
+~~~
 
 See [Quill modules docs](https://quilljs.com/docs/modules/) for more details.