从纯 JavaScript 中使用 CKEditor 5 DecoupledEditor答案

【问题标题】：Using CKEditor 5 DecoupledEditor from plain JavaScript从纯 JavaScript 中使用 CKEditor 5 DecoupledEditor
【发布时间】：2018-11-11 20:58:42
【问题描述】：

我正在尝试使用 CKEditor 5 框架和我自己的插件构建自定义编辑器。

我的webpack.config.js 包含以下行：

module.exports = {
    // https://webpack.js.org/configuration/entry-context/
    entry: './app.js',
...

所以当我跑步时

./node_modules/.bin/webpack

它会为我生成一个bundle.js 文件，其中包括我的app.js 的内容。

如果我的app.js 文件调用DecoupledEditor.create(...) 并且如果我用./node_modules/.bin/webpack 构建它，然后在我的HTML 文件中包含<script src='dist/bundle.js' />，那么一切正常，我得到一个带有我自己的插件的CKEditor :)

但我真正需要的是能够从我自己的自定义手写 JavaScript* 调用 DecoupledEditor.create(...)，它不是使用 webpack 构建的，我无法让它工作。

如何从纯 javascript 中使用 CKEditor 5 DecoupledEditor？

我想我需要导入类，但如果我做一个

import DecoupledEditor from '@ckeditor/ckeditor5-editor-decoupled/src/decouplededitor';

在我自己的 javascript 中，我得到了错误

“TypeError：解析模块说明符时出错：@ckeditor/ckeditor5-editor-decoupled/src/decouplededitor”

*确实是从 GWT 调用，但这并不重要。

【问题讨论】：

标签： javascript ckeditor ckeditor5

【解决方案1】：

事实证明，如果我使用

<script src="https://cdn.ckeditor.com/ckeditor5/10.0.1/decoupled-document/ckeditor.js"></script>

我可以直接从我的 javascript 调用 DecoupledEditor.create(...) 而不是我自己的 bundle.js，而无需任何导入。所以我想我的问题是我无法用我的构建脚本构建 DecoupledEditor。

【讨论】：