Registration of quill-image-resize-module fails

See original GitHub issue

I have been trying to register an image resize module (https://github.com/kensnyder/quill-image-resize-module) with Quill. But as soon as Quill.register('modules/imageResize', ImageResize); is called, I get the following error: TypeError: Cannot read property 'imports' of undefined

I created a plunker that shows the issue: https://plnkr.co/edit/IrSndtpRKSXG324zArN7?p=preview

I don’t really know if this is really an issue or if I’m simply mistaking something in the configuration. I have had a look at the examples provided and other issues but have not been able to resolve this problem. Hence, any help would be deeply appreciated as the ability to resize images is something quite handy to have.

Thank you very much.

Issue Analytics

State:
Created 6 years ago
Comments:6 (2 by maintainers)

Top GitHub Comments

12reactions

viniciusaugutiscommented, May 25, 2018

People who are having difficulty using the quill image resize module with ANGULAR-CLI e ANGULAR 2+ Here’s a way to not have to tinker with the webpack.config.ts file

terminal

npm install quill --save
npm install quill-image-resize-module --save

angular-cli.json

"scripts": [
        ...,
        "../node_modules/quill/dist/quill.min.js"
 ]

Componente.ts

import * as QuillNamespace from 'quill';
let Quill: any = QuillNamespace;
import ImageResize from 'quill-image-resize-module';
Quill.register('modules/imageResize', ImageResize);

this.editor_modules = {
      toolbar: {
        container: [
          [{ 'font': [] }],
          [{ 'size': ['small', false, 'large', 'huge'] }],
          ['bold', 'italic', 'underline', 'strike'],
          [{ 'header': 1 }, { 'header': 2 }],
          [{ 'color': [] }, { 'background': [] }],
          [{ 'list': 'ordered' }, { 'list': 'bullet' }],
          [{ 'align': [] }],
          ['link', 'image']
        ]
      },
      imageResize: true
    };

Componente.html <quill-editor [modules]="editor_modules" [(ngModel)]="content"></quill-editor>

1reaction

KillerCodeMonkeycommented, Jul 2, 2017

Did you checked this issue in the repo: https://github.com/kensnyder/quill-image-resize-module/issues/7#issuecomment-304463415

Top Results From Across the Web

quill-image-resize-module--fix-imports-error - npm

A module for Quill rich text editor to allow images to be resized. And fix some error. Latest version: 3.0.0, last published: 3...

quill-image-resize-module--fix-imports-error v3.0.0 - npm.io

Quill ImageResize Module A module for Quill rich text editor to allow images to be resized. Also see quill-image-drop-module, a module that...

ngx-quill and Quill resize module breaking Jasmine tests

I stumbled across a fix after reading this github post. Instead of importing Quill I imported QuillNameSpace and defined Quill as ...

quill-image-resize-module-ts - npm package - Snyk

We found indications that quill-image-resize-module-ts is an Inactive project. See the full package health analysis to learn more about the package maintenance ...

quill-image-resize-module - Bountysource

I can be a problem when a user change alignment as final action since it will not be registered by my Vue component...