ScanSkill

Export

In React, imports and exports helps to split codes and reuse them into multiple files. export helps in exporting the functions or components from that component to other components. There are two ways of exporting in React.

  • default exports.
  • named exports.

default exports.

default exports means exporting the whole module or component. Every module should have a default export. While exporting the default export from a module, we can use the statement export default
 

Syntax

export default ComponentName

Example

function MyComponent(){
 return <h1>Hello World </h1>
}

export default MyComponent   //exporting the component

named exports.

exporting the named exports means exporting a specific function to other components. A module may have one, many, or no named exports at all. While exporting the named export from a module, we just use the statement export
 

Syntax

export NAME;

Example

export function MyComponent(){
 return <h1>Hello World </h1>
}