Some help with JS Import statements

[moschap]

Good day Guys,

Sorry for asking if this is obvious but where is GitterMobile defined from this statement import GitterMobile from './app', in the index.android.js file.

I have looked in the app /folder which is in the root of the project and i still don't see it. Please help and great job too.

[terrysahaidak]

Hey @moschap, thank for the kind words.

import GitterMobile from './app' is just the short of import GitterMobile from './app/index.js'.
You can check the index.js file.

[moschap]

Thanks @terrysahaidak ,
I guessed as much that was what the intent was, but my confusion is that in the file /app/index.js there is only this line of export, export default Root.

Sorry again if i am asking as obvious question but where is the GitterMobile derived from? or if there are links that you can refer me to, to catch up on the pattern of import.

[terrysahaidak]

As you can see, it's not just export default Root

class Root extends Component {
  render() {
    return (
      <Provider store={store}>
        <View style={{flex: 1}}>
          <App />
        </View>
      </Provider>
    )
  }
}

export default Root

It exports Component named Root I defined above.
I could also write export default class Root extends Component { }.
It all is just a new module syntax, with old one I have to write:
module.exports = Root.

[moschap]

Yes that is correct. Sorry i missed out that part of the code in my earlier question. I understand that part actually.
The part that is confusing me is the GitterMobile in the import statement. I would have assumed that based on the code above the import from index.android.js file would have been import Root from './app'

[terrysahaidak]

Yeah, but it default export, not named, so I can name the module var whatever I want:

// foo.js
const foo = { }
export default foo

// bar.js
const bar = { }
export bar

// baz.js
import whatEverIwant from './foo' // const someVar = require('./foo')
import {bar} from './bar' // const bar = require('./bar').bar or const {bar} = require('./bar')

So I named my root component in the entry file as GitterMobile for better semantic :)

[moschap]

@terrysahaidak ,

Oh now i understand. Thanks a bunch for the clarification, it all makes sense now.

[terrysahaidak]

I glad I could help you, @moschap :)