5

I read through this great answer that shows how to create a stack snippet with React and JSX in it, but of course I want more. I'm currently working on a project that uses React and other libraries that I installed from npm. Is there a way to also include those in a stack snippet so I can ask a question about them?

The specific question I want to ask is about react-ace and m-react-splitters, so I'd like to include those two libraries in a stack snippet. I found a CDN version of m-react-splitters, but it looks like it's designed for some package system that isn't supported inside a stack snippet. When I try to include it, I get this error:

Uncaught ReferenceError: exports is not defined

Would I have to package it up with browserify and then host that version somewhere to include in my question?

Here's my attempt to get m-react-splitter working with React:

// Example stateless functional component
const SFC = props => (
  <div>{props.label}</div>
);

// Example class component
class Thingy extends React.Component {
  render() {
    const {title} = this.props;
    console.log("rendered");
    return (
      <div>
        <div>{title}</div>
        <SFC label="I'm the SFC inside the Thingy" />
      </div>
    );
  }
}

// Render it
ReactDOM.render(
  <Thingy title="I'm the thingy" />,
  document.getElementById("react")
);
<div id="react"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/m-react-splitters@1.2.0/index.js"></script>

0

You must log in to answer this question.

Browse other questions tagged .