如何将链接图像添加到React中的CKeditor？

Question

我想将链接图像链接到我的React应用程序的功能，该应用程序使用“

@ckeditor/ckeditor5-build-decoupled-document

代码：

import React from 'react'
import { CKEditor } from "@ckeditor/ckeditor5-react";
import * as  DecoupledEditor from "@ckeditor/ckeditor5-build-decoupled-document";

但是当我导入时：

import linkimage from '@ckeditor/ckeditor5-link/src/linkimage';

我会收到一个错误：

untured ckeditorError：ckeditor-duplicated-modules

更多有关

如何添加链接图像？

Answer 1

我假设您已经完成了：

npm install --save @ckeditor/ckeditor5-image

并启用了插件：

import LinkImage from '@ckeditor/ckeditor5-link/src/linkimage';

然后将其添加到您的编辑器配置中：

image: {
    toolbar: [
        'imageStyle:block',
        'imageStyle:side',
        '|',
        'toggleImageCaption',
        'imageTextAlternative',
        '|',
        'linkImage' <---- here
    ]
}

即使错误仍然持续存在，请尝试使用错误代码文档在这里

Packages were duplicated in node_modules

In some situations, especially when calling npm install multiple times, it may happen that npm will not correctly "deduplicate" packages.

Normally, npm deduplicates all packages so, for example, @ckeditor/ckeditor5-core is installed only once in node_modules/. However, it is known to fail to do so from time to time.

We recommend checking if any of the steps listed below help:

    rm -rf node_modules && npm install to make sure you have a clean node_modules/ directory. This step is known to help in most cases.
    If you use yarn.lock or package-lock.json, remove it before npm install.
    Check whether all CKEditor 5 packages are up to date and reinstall them if you changed anything (rm -rf node_modules && npm install).