Troubleshooting the ckeditor-duplicated-modules error when trying to install a local npm package that should utilize the node_modules of the main project through yarn

As I work on my MainProject, I'm attempting to set up a local version of the ckeditor-5 plugin PeteCkPlugin that was generated using the ckeditor5 package generator.

I experimented with using yarn link within the local directory of PeteCkPlugin, followed by

yarn link @PeteSpace/PeteCkPlugin
in the root directory of MainProject. However, this resulted in a
Usage Error: Invalid destination '@PeteSpace/PeteCkPlugin'; Can't link the project to itself
message.

Another approach I tried was utilizing the yarn package.json resolutions field:

{
  ...,
  "resolutions": { 
    "@PeteSpace/PeteCkPlugin": "link:/path/to/project/PeteSpace/PeteCkPlugin" 
  },
  ...
}

This method successfully installed the package. However, MainProject encountered a failure with an

"Uncaught CKEditorError: ckeditor-duplicated-modules. Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-ckeditor-duplicated-modules"
error. This issue seemed to stem from the local PeteCkPlugin package utilizing its own
PeteCkPackage/node_modules/ckeditor package
instead of the shared
MainProject/node_modules/ckeditor package
.

I experimented with replacing link: with portal: within the resolutions value as well...

Since the package is private and I am not yet part of the correct npm organization, I am unable to publish it. Any suggestions or insights on symlink behavior and the interactions between yarn and npm would be greatly appreciated as I navigate this process.

Answer №1

In my experience, I have encountered similar issues with the yarn link command, leading me to switch to yalc instead. Using yalc has proven to be consistently reliable for me.

Here is a simple step-by-step process:

  1. Install Yalc globally
volta install yalc # or `npm i -g yalc` if you don't use volta
  1. Publish your dependency
yalc publish # run from dependency root after build process
  1. Link the dependency
yalc link # run from the root of your main project

You also have the option to subscribe and autopublish changes from your dependency.

For more detailed information, please refer to the official readme.

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

There seems to be a column in the MySQL INSERT query that is unidentifiable and does not exist in the list of fields

id and cost are required as integers and cannot be left empty. I encountered the following error message: 'Error: ER_BAD_FIELD_ERROR: Unknown column 'undefined' in 'field list'' var sql = "INSERT INTO Paintings(` ...

When a fresh tile is loaded in Mapbox, an event is triggered

As I work with the Mapbox GL JS API to manipulate maps, I find myself wondering if there is an event that can inform me whenever a new tile HTTP request is made. My code snippet looks like this: map.on("dataloading", e => { if(e.dataType ...

Issue arises where multiple asynchronous functions cause infinite re-rendering due to the shared loading state

Currently, I am integrating zustand 4.1.5 into my React application. Upon clicking the LogDetails tab, two asynchronous functions with identical loading state settings are triggered simultaneously, leading to an endless rerendering cycle and causing the & ...

Utilize jQuery to apply inline styles to dynamically created div elements

I am attempting to apply inline styles to a div using jQuery. The current state of the div, as seen in Firebug, is shown below: https://i.sstatic.net/rqhIc.jpg My goal is to retain the existing CSS while adding margin-left:0 and margin-right:0 to the cur ...

What is the best way to send an HTTP request in AngularJS to receive data in JSON format?

I am trying to create an AngularJS app that can send HTTP requests for JSON data. I have written the code in my index.html file to request JSON data using AngularJS, but for some reason, the JSON data is not being printed. When I check the console in Fire ...

What is the best way to modify and execute js and css (less) files dynamically using ajax and jQuery?

Whenever I click a button, an ajax call is triggered to load various html code into a div with the id 'main'. While displaying the html content is not an issue, integrating and applying css and js code to my current page has proven to be challeng ...

Replacing default hover behavior from an external library

Currently, I am utilizing a JS library that comes with a specific widget. Basically, I have the following list (I removed unnecessary DOM code): <li class="disabled"> When I hover over this list item, it turns into: <li class="disabled state-a ...

Use JavaScript to change the CSS pseudo-class from :hover to :active for touch devices

Looking to eliminate hover effects on touch devices? While it's recommended to use a hover class for hover effects, instead of the hover pseudo-class, for easier removal later on, it can be a challenge if your site is already coded. However, there&apo ...

Searching for hidden elements within a div using a filter option

An accordion is located inside a div and a search box has been added to the div with the intention of serving as a search filter. Some accordion elements are visible within the div while others are hidden. The problem arises when trying to make the filter ...

Do we really need to create our own action creators in Redux Toolkit?

As I delve into implementing the redux toolkit in my react projects, I've come up with a structure for writing slices using redux-thunk to handle API requests. import { createSlice } from "@reduxjs/toolkit"; import axios from "axios&quo ...

Mocha disappearance following Windows 10 update

Ever since the latest Windows 10 update, I've been having issues running mocha. Unfortunately, rolling back the update is not an option for me. Here's the error message I keep seeing: mocha : The term 'mocha' is not recognized as the na ...

How to create select options in Angular.js without using the ng-option directive

I receive a JSON object from a service and I am using some of its fields to populate my select option list. However, when I try to print the selected value in my controller, the output response is "undefined". Can someone help me figure out what I'm ...

GLTF file: Error 404 - File could not be located

Working on loading a GLTF file and encountering a specific error: https://i.sstatic.net/EbovJ.png Curious as to why the file cannot be located and opened. Is it necessary to establish a local server for this process? After reviewing other examples online ...

What is the best way to end a table row after every group of four items?

I am working with a Handlebars template to display an array of movies in a table with four columns. Currently, I have set up a HBS helper in my code: app.engine('handlebars',exphbs({ defaultLayout: 'main', helpers: { n ...

Having trouble opening the prompt window by clicking on the button

I have been given an assignment to check if a given number is an Armstrong number. However, I am facing an issue where the prompt window does not appear when I click the button. This issue only arises when the rest of the function is written out. If the ...

Locate a precise match in MongoDB for nested objects within an array

Database example image Hello everyone, I'm having difficulty selecting the name="Clothing" element. I've attempted using .find and element Match but have had no success. Can anyone provide assistance? ...

Error Notification "File cannot be located" appeared while using Gulp on a Mac device

Struggling to set up Gulp on MacOS 10.12.3, but keep encountering the frustrating error message: "No Gulp File Found." Here's what I've tried so far: Installed gulp cli globally using sudo bash. Current Gulp version: 3.9.1 Installed gulp local ...

Tips for utilizing the simple-peer module within a Node.js environment?

I recently started using Node.js and I'm interested in incorporating the simple-peer module into my application. However, I am struggling to understand how to implement it based on the provided documentation. Are there any resources available that can ...

Encountering an issue with npm installation in the angular-phonecat tutorial: Module 'update-notifier' not found

Having trouble running npm install in the angular-phonecat directory. Could be a problem with my paths, but I'm not certain. Any help would be greatly appreciated. Keep running into Error: Cannot find module 'update-notifier'. If I try to in ...

Encountering difficulty when integrating external JavaScript libraries into Angular 5

Currently, I am integrating the community js library version of jsplumb with my Angular 5 application (Angular CLI: 1.6.1). Upon my initial build without any modifications to tsconfig.json, I encountered the following error: ERROR in src/app/jsplumb/jspl ...