benx's avatar
Level 1

Installing CKEditor plugin in Laravel project

I am working on Laravel project that uses WYSIWYG editor (CKEDITOR). The problem I ran into is that I can't resize imported image in the editor itself.

In the official documentation I found out, that I need to install custom plugins for each missing functionality.

But so far I could not find a way to import any of official plugins into my Laravel project.

My current configuration is:

webpack.mix.js

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

resources/js/app.js

import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
window.ClassicEditor = ClassicEditor;

With this content of app.js the CKEditor works fine without using plugins.

Then I tried adding import for the specific plugin:

import ImageResize from '@ckeditor/ckeditor5-image/src/imageresize';
window.ImageResize = ImageResize;

But that resulted in throwing an error: Uncaught CKEditorError: ckeditor-duplicated-modules It also provided link to their documentation containing that error, where I realized that you can import the source file (@ckeditor/ckeditor5-editor/src/classsiceditor) or the build file (import ClassicEditor from '@ckeditor/ckeditor5-build-classic';), but here is where my understanding of what is going on faded away.

Anyway I also tried using the plugin in the view:

ClassicEditor.create(
      allEditors[i], {
        plugins: [ ImageResize],
        extraPlugins: [SimpleUploadAdapter]
      }
    );

But since it's not correctly imported it doesn't really matter.

I also found that Stackoverflow question from almost 3 years ago with similar problem, but no answers.

Any help will be really appriciated. Meanwhile I will also try some other WYSIWYG editors, and if any of those will be more promising will probably end up using one (will let you know here as well).

Best regards, Žiga

0 likes
0 replies

Please or to participate in this conversation.