Question

我正在尝试使用@ckeditor/ckeditor5-build-classic npm软件包在我的网站上设置CKEditor5。我已经安装了12.0.0版，这是今天的最新版本。

我正在使用以下设置方法-https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/advanced-setup.html#scenario-1-integrating-existing-builds，看来应该很简单。

我正在使用TypeScript，并且在模块中包含以下代码：

import ClassicEditor from "@ckeditor/ckeditor5-build-classic";

ClassicEditor
    .create(document.querySelector('.html-editor'))
    .then(editor => {
        console.log(editor);
    })
    .catch(error => {
        console.error(error);
    });

...，将其转换为以下JavaScript：

var ckeditor5_build_classic_1 = require("@ckeditor/ckeditor5-build-classic");
ckeditor5_build_classic_1["default"]
    .create(document.querySelector('.html-editor'))
    .then(function (editor) {
    console.log(editor);
})["catch"](function (error) {
    console.error(error);
});

不幸的是，页面加载时出现以下错误：

addadventure.ts:11 Uncaught TypeError: Cannot read property 'create' of undefined
    at Object.<anonymous> (addadventure.ts:11)
    at Object../wwwroot/js/pages/adventures/addadventure.ts (addadventure.ts:266)
    at __webpack_require__ (bootstrap:781)
    at fn (bootstrap:149)
    at Object.1 (addadventure.ts:266)
    at __webpack_require__ (bootstrap:781)
    at checkDeferredModules (bootstrap:45)
    at bootstrap:857
    at bootstrap:857

它知道ckeditor5_build_classic_1是一个类，但是ckeditor5_build_classic_1["default"]是未定义的。

编辑：

奇怪的是，如果我在断点所在的行上放置一个断点并在控制台中运行以下命令，它就可以工作...

ckeditor5_build_classic_1.create(document.querySelector('.html-editor'))

那是问题吗？

Answer 1

您是否尝试设置/取消设置esModuleInterop和allowSyntheticDefaultImports编译器选项？

Answer 2

您尝试使用此import吗？

import * as InlineEditor from '@ckeditor/ckeditor5-build-inline';

CKEditor5设置“无法读取未定义的属性”创建”

2 个答案: