Just noticed that since we switched to Babel, compile error is ugly if you make a mistake on https://facebook.github.io/react/ interactive examples:

<img width="339" alt="screen shot 2017-04-21 at 4 53 33 pm" src="https://cloud.githubusercontent.com/assets/810438/25285719/23c3a592-26b3-11e7-976f-1f0b8ead7ed3.png">

We should fix it to preserve the newlines. It should be an easy fix.

You’d need to follow the instructions in the `docs` folder to get them running, then figure out a fix and send a PR. Please comment here if you plan to work on this so that two people don’t work on the same thing.

---

## Update: @tsriram is looking at this.
mode: 'jsx',
      lineNumbers: this.props.lineNumbers,
      lineWrapping: true,
      smartIndent: false,  
      matchBrackets: true,
      theme: 'solarized-light',
      readOnly: this.props.readOnly,
    });
    this.editor.on('change', this.handleChange);
  },
  componentDidUpdate: function() {
    if (this.props.readOnly) {
      this.editor.setValue(this.props.codeText);
    }
  },
  handleChange: function() {
    if (!this.props.readOnly) {
      this.props.onChange && this.props.onChange(this.editor.getValue());
    }
  },
  render: function() {
    
    var editor;
    if (IS_MOBILE) {
      editor = <pre style={{overflow: 'scroll'}}>{this.props.codeText}</pre>;
    } else {
      editor = <textarea ref="editor" defaultValue={this.props.codeText} />;
    }
    return (
      <div style={this.props.style} className={this.props.className}>