ckeditor-loader

ckeditor-loader

webpack loader to load ckeditor

USAGE

code:

import $ from 'jquery';
import React, {Component} from 'react';
import ReactDOM from 'react-dom';

import Editor from './ckeditor.conf';

window.$ = $;
window.editor = Editor;

class App extends Component {

  componentDidMount() {
    var context = this.refs.editorContext;
    this.editor = Editor.appendTo(context, {
      customConfig: '',
      width: 640,
      height: 480,
    });
  }

  render() {
    return (
      <div className="wrapper">
        <header>
          <h1>CKEditor</h1>
        </header>
        <section>
          <div ref="editorContext" />
        </section>
      </div>
    );
  }
}

$(function() {
  ReactDOM.render(
    <App />,
    document.getElementById('app'),
    () => {
      console.log('App mounted!');
    }
  );
});

editor.conf:

{
    "plugins": ["link", "table"],
    "languages": ["zh", "en"],
    "theme": "moono"
};

loader:

module: {
    rules: [
    ...
    {
        test: /ckeditor.conf$/,
        use: [
            'ckeditor-loader'
        ]
    }
    ]