CODEWITHSUNDEEP
javascriptmeteorreactjs
John
John

Reputation: 4028

what is the difference between import Task and import { Task } in es6

What is the difference between 

import { Tasks } from '../api/tasks.js';

and

import Task from './Task.jsx';

when to use {} and when to not use {} ?

(by the way, this is from meteor tutorial https://www.meteor.com/tutorials/react/update-and-remove)

Upvotes: 0

Views: 293

Answers (3)

Jorawar Singh
Jorawar Singh

Reputation: 7621

if you want to grab the all modules you can do 

import * as test from "Test";

If you exporting only some modules and not all then you have to specify wictch module you want 

import { Module1, Module2, Module3 } from "Modules"; //grab only given in {}

if you have only export default Test you can to

import "Test";

read more about modules

Upvotes: 0

Akash Bhandwalkar
Akash Bhandwalkar

Reputation: 901

when you do

 import { Tasks } from '../api/tasks.js';

you are importing Task module from '../api/tasks.js';

when you do 

import Tasks  from '../api/tasks.js';

you are importing default export module from '../api/tasks.js'; Here Task is a variable which is referring default export module.

Example.

task.js export default Task;

case 1: It is Task from task.js case 2: It is Task variable pointing to Task module in task.js that is Task

if I do import someVariable from './api/task.js' still it will work because someVarible will point to default export module that is Task module in task.js

If I do

import {someVariable} from './api/task.js' it will search for module someVariable in task.js but it is not there so now it is undefined.

Upvotes: 0

mfrachet
mfrachet

Reputation: 8922

You don't have to use the {} when you precise that it's a default export.

For example :

export default class Test{}

You can do :

import Test from './test'

In the other hand, if you don't precise "default" keyword, you have to precise {} : 

export class Test {}

gives 

import { Test } from './test'

Upvotes: 2

Related Questions