CKEditor bower 全局默认 config.js

Question

我有一个 Angular 项目，我们使用 angular-ckeditor。对于这个角度模块，我需要通过 bower 安装的 ckeditor.js。现在我们有多个页面，其中有 ckeditor 实例，但它们都应该使用相同的配置。

使用 CKEditor，您可以更改默认配置 by changing the config.js。然而，这不是一个好的选择，因为当应用程序被部署/共享/重新安装时，bower 会安装 ckeditor 脚本，因此 config.js 也会被覆盖。

我知道我可以执行CKEDITOR.replace('myEditor', { customConfig: '/custom/path/to/config/ckeditor_config.js' }); 之类的操作，但这将是每个实例，而且我不知道运行时编辑器的 id 是什么。

还有其他方法可以为 CKEditor 定义 global 配置吗？不接触其库中的 config.js？

我可能的丑陋解决方案：

1. 在源代码管理中签入 CKEditor 脚本，不要通过 bower 安装（这样 config.js 不会被覆盖）
2. 创建一个自定义指令，将指令替换为 ckeditor 和 customConfig 配置
3. 在安装 bower 后创建一个覆盖 config.js 的 gulp 任务
4. 为所有ckeditor添加id并使用CKEditor.replace()方法
5. 将配置传递给 ckeditor 的每个实例 (<textarea ckeditor="{ customConfig: 'myCustomConfig' }"></textarea>)
6. 使用我在文档中遗漏但确实存在的方法（首选！:)）

对此的“最佳”解决方案是什么？

Answer 1

我将 ckeditor.config.js 添加到 index.html 中（我的项目使用 Grunt） 并链接到 ckeditor_config.js

// scripts/libs/ckeditor.config.js
CKEDITOR.config.customConfig = "/scripts/libs/ckeditor_config.js";

// scripts/libs/ckeditor_config.js
CKEDITOR.editorConfig = function (config) {
  config.toolbarGroups = [
    { name: 'mode' },
    { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
    { name: 'editing',     groups: [ 'find' ] },
    { name: 'basicstyles', groups: [ 'basicstyles' ] },
    { name: 'links' },
    { name: 'styles' },
    { name: 'cleanup' }
  ];
	config.removeButtons = 'Anchor,Strike,Styles,Font';
  //config.removePlugins = 'font';
  config.extraPlugins = "find,font";
}

<!-- index.html -->
<script src="bower_components/ckeditor/ckeditor.js"></script>
<script src="scripts/libs/ckeditor.config.js"></script>