Importing in React JS

Question

What is the difference between

import Something from 'react';

and

import {Something} from 'react';

What does those curly braces means?

Answer 1

import Something from 'react';

imports what is the default exported of a module. In this case the export should be like

export default const Something = function(){...}

import {Something} from 'react'; imports a named export, like

export const Something = function(){}

If your module has both default and named exports you can import them in a single like. Example

//module A
export default const Something = function(){}
export const SomethingElse = function(){}

And then import them like

//module B

import Something, { SomethingElse } from 'moduleA';

In the previous like you dont have to import the default as Something, you can import it with whatever name you want.

import A from 'moduleA'

is equal to

import Something from 'moduleA'