importing throws error unless index is specified

Hi,

This is weird…

I have a file app/index.js with:

import React from 'react';
import { View, Text } from 'react-native';
export const App = () => (
  <View>
    <Text>The App</Text>
  </View>
);
export default App;

In this case I should be able to do either import App from './app' or import { App } from './app' and use it in my AppRegistry.registerComponent.

However I get the following error unless I import the path ./app/index which you should not need to do.

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

Versions installed, osx siera, node v7.5.0:

react-native-cli: 2.0.1
react-native: 0.41.2

This is the first I have ever come across having to specify index is this a known issue?

[rhysburnie]

@brentvatne FYI - Figured out what was happening…

If you have a file ./app/index.js and you attempt to import like so:

import Something from './app';

What actually happens is the system is importing the root level ./app.json file which contains the object in question.

So while this isn’t a bug it is perhaps a gotcha?

It seems reasonable to expect that some developers may create an app folder and that they may create an index.js in that folder and expect it to import as expected.

The gotcha is that the system prefers ./app.json over ./app/index.js

[ujwal-setlur]

Got burned by this as well 😃. Interestingly, it worked fine on android, but gave problems on ios. I just deleted app.json. Is it actually needed?