Bug issue with babel-plugin-transform-react-constant-elements

When I work on my React Project, I usually put the component files in a directory and create a index.js so that I can load the components like import { UserInfo, AnotherComponent } from 'container';

Today, I tried using that structure with create-react-app. It works perfectly on the dev-server, but it gives following error when I try to load the component:

React: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

My have uploaded the directory structure and codes on gist: https://gist.github.com/velopert/ab6e132d73a17930c90e3e38493c12ed

It seems like there’s no problem if I import and render the components from outside of the directory. (For example, I can import and render App component from src/index.js, if I do not render UserInfo from App component). I tried console.log(<UserInfo/>) from App, and it seems like there is no problem with importing the module. I think there is an issue with rendering it.

Anyways, I just have found out that the babel-plugin-transform-react-constant-elements is the one that causes problem. I commented out the babel-plugin-transform-react-constant-elements part from the babel.prod.js and it works fine again.

Thanks !

[hzoo]

From https://github.com/babel/babel/pull/3596#issuecomment-235892988: https://phabricator.babeljs.io/T7520 cc @kittens

Although there are a few of these: https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/#R

[kaatt]

Also check: babel/babel#4516