KeystoneJS TinyMCE 编辑器中的代码语法高亮显示答案

【问题标题】：Code Syntax Highlighting in KeystoneJS TinyMCE EditorKeystoneJS TinyMCE 编辑器中的代码语法高亮显示
【发布时间】：2016-10-27 18:01:31
【问题描述】：

我正在尝试安装 "codesample" TinyMCE plugin 以在 Keystone.js 中启用代码语法突出显示。我将以下行添加到 keystone.js 文件 per the documentation 的 keystone.init 部分。但是，不会出现启用语法高亮的额外按钮。

'wysiwyg additional plugins': 'codesample',
'wysiwyg additional options': {
        external_plugins: {
            'codesample':'/js/tinymce/plugin.min.js'
       }

插件文档说代码突出显示按钮是插件的一部分。由于该按钮没有显示，我试图通过添加以下行来强制它。

'wysiwyg additional buttons': 'codesample',

控制台上没有显示任何错误。在使用 KeystoneJS 获得这种或其他形式的代码语法突出显示方面的任何帮助，我将不胜感激。

【问题讨论】：

你有解决这个问题的方法吗？
不，我从来没有这样做过。

标签： javascript tinymce keystonejs

【解决方案1】：

您可以将 TinyMCE 包含的插件放入您的 keystone.init 函数中：

'wysiwyg additional plugins': 'codesample',
'wysiwyg additional buttons': 'codesample',

但是当我这样做时，虽然它可以正常工作，但您似乎可以创建代码示例，但不能编辑它们，除非您删除并重新制作它们。我尝试用更新的版本替换 keystone (majorVersion:"4",minorVersion:"4.3") 中包含的 TinyMCE 版本，因为 5.2 及更高版本声称已解决此问题，但这对我没有任何好处。

也许您以这种方式安装插件会更好，将其视为外部插件：

'wysiwyg additional options': {
        skin : 'lightgray',
        menubar : 'file edit format view insert',
        relative_urls: false,
        content_css: '/assets/css/styles.min.css',
        visualblocks_default_state: true,
        external_plugins: {
            'tinyvision':'/assets/plugins/tinyvision/build/plugin.min.js'
        },
        tinyvision: {
            source: '/api/images'
        }
}

参考：https://github.com/keystonejs/keystone/issues/1549

有点没用的参考：http://keystonejs.com/docs/configuration/#options-ui

【讨论】：