如何在使用 Jhipster 创建的 Angular 应用程序中集成 PrimeNG 编辑器答案

【问题标题】：How to Integrate PrimeNG editor in angular app created with Jhipster如何在使用 Jhipster 创建的 Angular 应用程序中集成 PrimeNG 编辑器
【发布时间】：2018-06-23 03:16:32
【问题描述】：

我正在尝试将PrimeNG editor 集成到JHispter 生成的angular 应用程序中。
我关注了 general instructions 和 editor instructions 的 PrimeNG 网站：

npm install primeng --save
npm install @angular/animations --save
npm install quill --save
将 Quill 添加到 angular-cli.json 中的脚本
在home.modules 中导入EditorModule
在 html 文件中添加了<p-editor [(ngModel)]="text" [style]="{'height':'320px'}"></p-editor>
执行npm start 命令来运行应用程序。

用户界面如下所示并得到以下错误：

ERROR ReferenceError: Quill is not defined 在 Editor.ngAfterViewInit (webpack-internal:///./node_modules/primeng/components/editor/editor.js:36)

谢谢

【问题讨论】：

您是否按照这些说明进行操作？ stackoverflow.com/questions/44162427/…
@GaëlMarziou 也尝试了上述说明。这个错误是因为home模块找不到quill.js。

标签： angular editor jhipster primeng

【解决方案1】：

我有同样的错误。

将以下行添加到我的 webpack.common.js 到插件中，现在它可以工作了。

new webpack.ProvidePlugin({ Quill: "quill" })

【讨论】：

【解决方案2】：

我遇到了同样的问题。

我不确定这是正确的解决方案，但它对我有用 -

将下面的行添加到 index.html -

 <script src="https://cdnjs.cloudflare.com/ajax/libs/quill/1.3.5/quill.min.js" integrity="sha256-OEsiRE77EL46ZjgPqmsXfsNcOQPrMG/M6hHBF65jXP4=" crossorigin="anonymous"></script>

【讨论】：