ckeditor4使用最新的Prism插件代码高亮异常问题解决

ckeditor4 插件Prism更新到最新的版本会出现无法高亮或者高亮不正确的现象，可能最新Prism版本和codesnippet不兼容造成，只需要修改codesnippet插件两个地方既可以解决

1、找到codesnippet插件源码
默认不自带此插件,需要自己下载，然后将解压的目录放在plugins下，下载地址和说明见附件

plugins/codesnippet/plugin.js

2、找到方法registerWidget()
3、找到data()方法
4、修改之前如下：

data: function() {
    var newData = this.data,
        oldData = this.oldData;

    if ( newData.code )
        this.parts.code.setHtml( CKEDITOR.tools.htmlEncode( newData.code ) );

    // Remove old .language-* class.
    if ( oldData && newData.lang != oldData.lang )
        this.parts.code.removeClass( 'language-' + oldData.lang );

    // Lang needs to be specified in order to apply formatting.
    if ( newData.lang ) {
        // Apply new .language-* class.
        this.parts.code.addClass( 'language-' + newData.lang );
        this.highlight();
    }

    // Save oldData.
    this.oldData = CKEDITOR.tools.copy( newData );
},

修改之后如下：

data: function() {
    var newData = this.data,
        oldData = this.oldData;

    if ( newData.code )
        this.parts.code.setHtml( CKEDITOR.tools.htmlEncode( newData.code ) );

    // Remove old .language-* class.
    if ( oldData && newData.lang != oldData.lang ){
        this.parts.code.removeClass( 'language-' + oldData.lang );
        this.parts.pre.removeClass( 'language-' + oldData.lang );
    }

    // Lang needs to be specified in order to apply formatting.
    if ( newData.lang ) {
        // Apply new .language-* class.
        this.parts.code.addClass( 'language-' + newData.lang );
        this.parts.pre.addClass( 'language-' + newData.lang );

        this.highlight();
    }

    // Save oldData.
    this.oldData = CKEDITOR.tools.copy( newData );
},

主要添加了两句代码
this.parts.pre.removeClass( 'language-' + oldData.lang );
this.parts.pre.addClass( 'language-' + newData.lang );

大功告成，最后附一张效果图

附：
1、codesnippet下载地址

https://ckeditor.com/cke4/addon/codesnippet

2、将下载的文件解压，将codesnippet拷贝到ckeditor的plugins目录下，
codesnippet目录结构如下

3、修改ckeditor的config.js

config.extraPlugins = 'codesnippet';