Question

我正在使用this package创建Vue spa并在此处集成CKEditor，我试图通过将其添加到我的app.js中来完成与教程一样的操作

import Vue from 'vue'
import ClassicEditor from '@ckeditor/ckeditor5-build-classic'
import documentEditor from '@ckeditor/ckeditor5-build-decoupled-document'
import VueCkeditor from 'vue-ckeditor5'

const options = {
  editors: {
    classic: ClassicEditor,
    document: documentEditor
  },
  name: 'ckeditor'
}

Vue.use(VueCkeditor.plugin, options);

并使其工作，我将NPM安装到这两个编辑器（ClassicEditor和documentEditor）

npm install --save @ckeditor/ckeditor5-build-decoupled-document

并且由于我也需要CKEditor，但更简单，或者说没有图像上传功能，因此我选择了ckeditor5 build classic，并从那里删除了这些插件，然后再进行NPM build，然后在Vue spa上进行了此操作< / p>

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

此后，我在node_modules上打开@ckeditor文件夹，找到ckeditor5-build-classic文件夹，并用我的自定义版本CKEditor build classic替换build文件夹

但是我得到这个错误

ckeditor-version-collision: The global CKEDITOR_VERSION constant has already been set.

即使编辑器仍在工作，但我不喜欢控制台显示错误的想法

Answer 1

此问题已在docs中进行了精确描述，您不能在同一页面上运行来自不同内部版本的两个编辑器（或混合内部版本和源代码）。

tl; dr;启用在同一站点上运行两个不同编辑器的最简单方法是创建一个自定义版本，该自定义版本将导出这两个版本。上面的文档对此进行了说明。

〜3个月前，行为已更改，此错误已添加到这种情况中，以防止错误和较大的捆绑包大小。因此，https://github.com/igorxut/vue-ckeditor5的作者可以更新自述文件以遵循最新版本的API。

Answer 2

我建议创建"super build"。

例如，您可以克隆classic build的存储库并更改3个文件。

检查我的gits。

我更新了example1，以使用该build。

全局CKEDITOR_VERSION常量已在vue上设置

2 个答案: