title: Uncaught ReferenceError: exports is not defined react-rails
body: <p>I need to add react-rails to my rails 4 app, but it's giving me hard time to figure out.</p>
  <p>my project uses sprockets for assets:precompilation,</p>
  <p>this is my component:</p>
  <pre><code>import React from &quot;react&quot;
  
  class Sidebar extends React.Component {
    render() {
      return (&lt;p&gt; hello from react &lt;/p&gt; );
    }
  }
  
  export default Sidebar;
  </code></pre>
  <p>when I load the page everything works fine, except for the react component, which is just rendered as a div in the html, and in the console I see:</p>
  <pre><code>Sidebar.self.js?body=1:1 Uncaught ReferenceError: exports is not defined
      at Sidebar.self.js:1:23
  </code></pre>
  <p>there's an initial snippet added there:</p>
  <pre><code>Object.defineProperty(exports, &quot;__esModule&quot;, {
    value: true
  });
  </code></pre>
  <p>That causes the problem.</p>
  <p>I tried everything I could find:</p>
  <ul>
  <li>Webpacker (but that gave way more troubles so I removed it)</li>
  <li>installing <a href="https://github.com/TannerRogalsky/sprockets-es6" rel="nofollow noreferrer">https://github.com/TannerRogalsky/sprockets-es6</a></li>
  <li><a href="https://stackoverflow.com/questions/43042889/typescript-referenceerror-exports-is-not-defined">Typescript ReferenceError: exports is not defined</a></li>
  <li><a href="https://stackoverflow.com/questions/51924608/react-uncaught-reference-error-exports-is-not-defined">React uncaught reference error: exports is not defined</a></li>
  </ul>
  <p>and more. I'm not sure what I'm doing wrong (or maybe I misused one of the solutions above?)</p>
  <h2>update</h2>
  <p>I figured that I can send babel configuration options via react-rails gem using:</p>
  <pre><code>Rails.application.config.react.jsx_transform_options = {
    plugins: [&quot;@babel/preset-react&quot;],
    loose: [&quot;es6.modules&quot;]
  }
  </code></pre>
  <p>I'm not sure which plugins I should use, but this doesn't appear to be affecting a thing, except that it's not ignored, if I write something that is not recognised I do get an exception.</p>