当我尝试使用带有 angular 应用程序的 ckeditor5 构建生产版本时出现错误

Question

我在 angular 应用程序的组件中使用 ckedtior5 。

它在本地运行没有问题，但是当我尝试构建 prod 时它抛出了这个错误

ERROR in ./node_modules/@ckeditor/ckeditor5-angular/fesm5/ckeditor-ckeditor5-angular.js Module build failed (from ./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js): TypeError: Cannot read property 'kind' of undefined

我在错误中提到的文件中看不到任何名为 'kind' 的属性

// Module

import { CKEditorModule } from '@ckeditor/ckeditor5-angular';
imports: [
// other imports
CKEditorModule
]

// Component
import * as ClassicEditor from '@ckeditor/ckeditor5-build-classic';
public Editor = ClassicEditor;

// Html
<div class="col-sm-12 col-lg-12 mt-4">
              <label>Info</label>
              <ckeditor [editor]="Editor"
               data="<p>Hello World</p>"></ckeditor>
  </div>

Answer 1

我不知道问题出在哪里，但我尝试使用 ngx-quill 作为替代品，当我尝试构建 --prod --aot 时它抛出了同样的错误。

现在我降级到较低版本的 ngx-quill (6.3.1) 并且它工作正常。

Answer 2

在我的例子中，我使用的是 ckeditor4，当我使用 build --prod

构建项目时出现此错误

我通过在 tsconfig.js:

中添加 "allowSyntheticDefaultImports": true 解决了这个问题

"angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true,
    "allowSyntheticDefaultImports": true
  }

并在 angular.json

中将“buildOptimizer”更改为 false

"configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": false,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                }
              ]
            }
          }
        }

参考：https://github.com/ckeditor/ckeditor4-angular/issues/78

当我尝试使用带有 angular 应用程序的 ckeditor5 构建生产版本时出现错误

I am getting an error when I try to build the production build using the ckeditor5 with angular app

angular

ckeditor5