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.
try {
      compiledCode = this.compileCode({skipES2015Transform: true});
    } catch (err) {}
    var JSContent =
      <CodeMirrorEditor
        key="js"
        className="playgroundStage CodeMirror-readonly"
        onChange={this.handleCodeChange}
        codeText={compiledCode}
        readOnly={true}
        lineNumbers={this.props.showLineNumbers}
      />;
    var JSXContent =
      <CodeMirrorEditor
        key="jsx"
        onChange={this.handleCodeChange}
        className="playgroundStage"
        codeText={this.state.code}
        lineNumbers={this.props.showLineNumbers}
      />;
    var JSXTabClassName =
      'playground-tab' + (isJS ? '' : ' playground-tab-active');
    var JSTabClassName =
      'playground-tab' + (isJS ? ' playground-tab-active' : '');
    var JSTab =
      <div
        className={JSTabClassName}
        onClick={this.handleCodeModeSwitch.bind(this, this.MODES.JS)}>
          Compiled JS
      </div>;