jsx doesn't seem to transpile correctly - ruby-on-rails

Question

I am using the react-rails gem in a Rails(4.2.7) project. This is the only modification I've made to my default Gemfile:
gem 'react-rails'
I've defined a component in a .jsx file using es6 syntax:
class Foo extends React.Component {
render () {
return (<h1>hello</h1>)
}
}
This works fine, but when I attempt to import a js module, I get an error:
import ReactTransitionGroup from 'react-addons-transition-group'
class Foo extends React.Component {
render () {
return (<h1>hello</h1>)
}
}
foo.es6.self-69f3a42….js?body=1:11 Uncaught ReferenceError: require is not defined
It seems to me that if I'm not transpiling the jsx correctly then I would be getting an error in the first case, but I'm not. I've been using jsx all day long with no issues until I tried to use import.
I've tried adding the following to my Gemfile:
gem 'sprockets-es6'
gem 'babel-transpiler'
I've tried adding this to config/environments/development.rb:
config.react.jsx_transformer_class = React::JSX::BabelTransformer
And I've tried generating the component using the rails react component generator with the --es6 flag:
rails g react:component Foo --es6
What am I missing?

Answer 1

So here's how I resolved my issue: since I'm using the 'react-rails' gem, the addons are available via a configuration option - I added the following to config/application.rb:
config.react.addons = true
Then in my .jsx file, instead of import, this is the syntax I used to have access to ReactTransitionGroup:
var ReactTransitionGroup = React.addons.ReactTransitionGroup
I still don't understand, but maybe someday I will, why the import statement transpiles to require which is undefined, and how that could be fixed by anything other than defining require, or transpiling to something that is defined.