Import statements, ES2015, and Meteor

Hey all,

Just revisiting Meteor and trying to learn React and ES2015 at the same time. I have been following the Meteor Guide and so far it has been amazing at getting me ramped up on all 3 topics.

I have one simple question that I was hoping someone could answer. In the guide, I have seen two different styles of import statement, one that uses curly braces and one that doesn’t. See below:

import ReactDOM from 'react-dom';
versus
import { Meteor } from 'meteor/meteor';

What is the difference between these two, and how do I know when I should use the curly braces and when I shouldn’t?

Thanks!

Some modules are exporting only one thing (class, var, function). This is usually done like this:

export default class ReactDom ....

In this case you use first syntax. Other modules are exporting multiple things:

export function utilFunction1(...) { ... }
export function utilFunction2(...) { ... }

In this case you use second syntax to select only one (or choose a list of) exported thing that you want to import in your current namespace. BEWARE: this explanation is over-simplification, read the docs down below!

Usually authors of modules provide you with information, how to use their modules. If you want to know the gory details, read some docs )

The first import is importing an npm package. Since its npm you can just pass the name of the package. The second is importing from a meteor package and therefore needs to be differentiated from npm packages.

This section of the guide does a good job at explaining that