Ckeditor5-angular: How to add the ImageResize plugin?

[csimpi]

Dear Authors,
thank you for making this angular component for CKEditor 5!

I don't really understand how should I enable the ImageResize plugin.

I import the classic build:
import * as ClassicEditor from '@ckeditor/ckeditor5-build-classic';

When I try to add the ImageResize plugin I'm getting ckeditor-duplicated-modules error so it seems it has been added to the build.

{
    extraPlugins: [ ImageResize ],
    image: {
      toolbar: [ 'imageTextAlternative', '|', 'imageStyle:full', 'imageStyle:side' ]
    },

  };

If I remove the extraPlugins section from the config, the resized doesn't work/doesn't appear at all.

editor.plugins.has( 'ImageResize' ) returns false

So I'm not really sure what should I do now.

[ma2ciek]

Hi @csimpi!

Unfortunately, it's forbidden to use builds with source code (and in the angular integration there's also a problem with importing CKEditor 5 source code as there's a conflict with webpack loaders). The easiest solution here is to create a custom build of ckeditor5-build-classic with the ImageResize plugin added to the list of plugins. Sorry for the inconvenience.

[drilon-hametaj]

Hi, i have same problem, how can i create a custom build? In the guide it is not clear how to do in Angular

[csimpi]

@drilon-hametaj If you're following every step of the documentation very carefully, also you've read every single word, checked every link you'll be able to do it. After a couple of hours of struggling I could create my own package.

[ma2ciek]

You can also create a custom build using the online builder if you struggle with these steps.

[farrvince]

online builder

Hello
I made a custom build with this online builder, I added ImageResize and Underline, but still doesn't work.

https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable - {name: "underline"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "imageResize"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "imageResize:50"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "imageResize:75"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "imageResize:original"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "linkImage"}

[Warning] widget-toolbar-no-items: Trying to register a toolbar without items. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-widget-toolbar-no-items (ckeditor.js, line 5)
– {toolbarId: "mediaEmbed"}

[Warning] toolbarview-item-unavailable: The requested toolbar item is unavailable. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-toolbarview-item-unavailable (ckeditor.js, line 5)
– {name: "AutoLink"}

Here is my config:

``