Issue: Duplicate modules found in CKEditor 5 causing errors

Looking for assistance with integrating CKEditor 5 into a web application built with Vue.js and Laravel.

To install the necessary dependencies, I used the following command:

npm install --save @ckeditor/ckeditor5-vue @ckeditor/ckeditor5-build-classic

as mentioned in the documentation available here.

In my component file, I included the necessary imports for CKEditor:

<script>
    import draggable from 'vuedraggable'
    import CKEditor from '@ckeditor/ckeditor5-vue'
    import ClassicEditor from '@ckeditor/ckeditor5-build-classic'

    export default {
        components: {
            draggable,
            ckeditor: CKEditor.component
        },
        data() {
            return {

                editor: ClassicEditor,
                editorConfig: {

                }
            }
        },

However, I encountered an error message stating:

Error: ckeditor-duplicated-modules: Some CKEditor 5 modules are duplicated

I attempted to resolve this by following the recommendations provided:

rm -rf node_modules && npm install 

or deleting the package-lock.json file.

Further details on this error can be found in the documentation here.

If anyone has any insights or solutions to this issue, it would be greatly appreciated. Thank you.

Answer №1

I discovered that the mistake I made was inadvertently downloading the incorrect version of a CKEditor plugin.

Originally, my code looked like this:

"@ckeditor/ckeditor5-alignment": "^28.0.0",  // This was the plugin I mistakenly installed
"@ckeditor/ckeditor5-autoformat": "^27.1.0",
"@ckeditor/ckeditor5-basic-styles": "^27.1.0",
"@ckeditor/ckeditor5-block-quote": "^27.1.0",
"@ckeditor/ckeditor5-ckfinder": "^27.1.0",

After correcting my error by switching from 28.0 to 27.1, the problem was resolved.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Having trouble retrieving the iframe document using JavaScript

I'm currently facing an issue when trying to fetch an image from a website (not specifically Bing, this problem arises with every site). Upon running the code, it seems to be failing at the 'if' statement, indicating that there might not b ...

What are the reasons for transitioning from using <script> includes to npm installs?

I am currently working on a VueJS project where I utilize npm to handle all Vue-related components such as vue-resource, router, and Vuex. However, in my index.html file, I have also included additional scripts like Bootstrap, jQuery, and Tween using scrip ...

Leverage the power of the select function in Angular to transmit multiple parameters

In Angular Js, is there a way to utilize a select element in a manner similar to how you can use a list of links? For instance, if I have links set up like this: <a ng-click="ctrl.change('argument1','argument2')">One</a> & ...

Implement a Basic Custom Shader on a Cube in Three.js

Struggling with applying a basic custom shader to a cube in Three.js. Whenever I attempt to use the shader, the cube mysteriously vanishes. No issues when using a standard Toon or Lambert Material - cube rotates and behaves as expected. Oddly, Orbit Contr ...

Transform a complex PHP array into JSON format using JavaScript

I have a three-tiered PHP array with both numeric indices and key-value pairs. I would like to convert it to JSON, and reiterate through the object list. How would I do this? The PHP array is called $main_array, and appears as: Array( [0] => Arra ...

Styling headers in Vue, Vuetify table to appear bold

I am currently using Vue and Vuetify to create a table as needed. I would like to enhance the appearance of the headers by making them bold. my idea is to pass a class to the headers and customize them using CSS. However, even though I can see my custom cl ...

Receive axios responses in the exact order as the requests for efficient search functionality

Currently, I am working on integrating a search feature in React Native using axios. For the search functionality, I am incorporating debounce from lodash to control the number of requests being sent. However, there is a concern about receiving responses ...

Looking to showcase initial API data upon page load without requiring any user input?

Introduction Currently, I am retrieving data from the openweatherAPI, which is being displayed in both the console and on the page. Issue My problem lies in not being able to showcase the default data on the frontend immediately upon the page's fir ...

The function react.default.memo is not recognized at the createSvgIcon error

After updating my Material-UI version to 1.0.0, I encountered a peculiar error message stating that _react.default.memo is not a function at createSvgIcon Despite attempting to downgrade the react redux library to version 6.0.0 as suggested by some ...

Having difficulty positioning the Divider correctly among Grid items

I am trying to add a Divider between each item in my Grid. The desired output should resemble this:- Col 1 | Col 2 | Col 3 However, I am facing difficulties as the Divider is not visible and the items are displayed vertically. import "./style ...

Tips for exporting 3D objects from 3ds Max Studio for optimal use in Three.js

I am facing an issue with loading a 3D object that I created in 3D Studio Max! When I export it as a .obj file (which generates two files, .obj and .mtl), I have tried using OBJMTLLOADET(), MTLLOADER(), and OBJLOADER() but none of them seem to work. Other ...

Unable to execute PHP alongside a JavaScript event listener

Using PHP, I am creating a canvas for writing and the text output will appear in a textarea (handled by other functions). There are additional input tags like a title to gather user input. The values from these input tags (title and textarea) will be submi ...

Is the integer value included in the linear progression?

I have a unique setup where each time the user clicks a 'Done' button, 20 is added to a base number, x (..-40,-20,0,20,40,60..). This updated value of x is then saved in a database and displayed in real-time using Ajax. However, I am facing a ch ...

Utilizing a drop-down menu in AngularJS to dynamically change a URL and fetch images

Currently, I am in the process of creating a website using AngularJS that accesses images from reddit and showcases them based on various parameters such as number of votes and date posted. While this is not groundbreaking, my main goal is to enhance my sk ...

A guide on utilizing ClassName to insert new items into a DIV

Original HTML code: <span class="specLink"> <specialty><a title="Plastic Surgery" href="link2.aspx">Plastic Surgery</a></specialty> </span> <br /> <span class="specLink"> <specialty2><a titl ...

Change the color of the border to match the background color

I have a parent container with a unique background color. Inside the parent container, there is an unordered list (ul) with multiple list items (li), each having a distinct color and a brighter border color. Now, I am looking to extract the border color of ...

What is the best way to navigate to the bottom of a website, similar to a "back to top

I have implemented a code snippet on my blog to go "Back to top" using a combination of HTML, CSS, and JavaScript. Now I am looking to add functionality for the opposite action, which is to "Go to Bottom". The code for going back to the top looks like this ...

Sending information from JavaScript to Pug templateorTransferring

I'm currently experimenting with Node.js and MongoDB within an Express framework. My current goal is to achieve the following: Establish a connection to MongoDB and retrieve a document from a specific collection (which I have successfully done). Pr ...

Toggling the visibility of divs in a dynamic layout

How can I use JQuery/JavaScript to show only the comment form for a specific post when a button or link is clicked on a page containing multiple posts divs with hidden comment forms? <div class="post"> <p>Some Content</p> <a ...

Utilizing a Function's Return Value as a State in React - A Comprehensive Guide

Currently, I am delving into the realm of functional components within React and have crafted a simple piece of code that should output 'Nah' if the state value is at 0. However, there seems to be an issue as this functionality does not seem to ...