I need to add react-rails to my rails 4 app, but it's giving me hard time to figure out.
my project uses sprockets for assets:precompilation,
this is my component:
import React from "react"
class Sidebar extends React.Component {
render() {
return (<p> hello from react </p> );
}
}
export default Sidebar;
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:
Sidebar.self.js?body=1:1 Uncaught ReferenceError: exports is not defined
at Sidebar.self.js:1:23
there's an initial snippet added there:
Object.defineProperty(exports, "__esModule", {
value: true
});
That causes the problem.
I tried everything I could find:
- Webpacker (but that gave way more troubles so I removed it)
- installing https://github.com/TannerRogalsky/sprockets-es6
- Typescript ReferenceError: exports is not defined
- React uncaught reference error: exports is not defined
and more. I'm not sure what I'm doing wrong (or maybe I misused one of the solutions above?)
update
I figured that I can send babel configuration options via react-rails gem using:
Rails.application.config.react.jsx_transform_options = {
plugins: ["@babel/preset-react"],
loose: ["es6.modules"]
}
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.