Module - Export (Es Module)


The export statement is the counterpart of the import statement in the implementation of an ES module.

It has the same functionality that the modules.export statement of CommonJs

This feature is not implemented in any browsers natively at this time. It is implemented in many transpilers.

Export declare the module’s public API.


You can export any top-level function, class, var, let, or const.


Export tag

export function bar(arg1, arg2) {

export class foo {
  ... several methods doing image processing ...

// This function isn't exported and has then a local scope
function private() {

import them as

import { bar, foo } from ...


Rather than tagging each exported feature, you can write out a single list of all the names you want to export. It can appear anywhere in a module file’s top-level scope

export {
   bar as barre // you can rename the exported name

import it as

import { foo, barre } from ...




  • Export example with the shorthand syntax where the keywords export default can be followed by any value: a function, a class, an object literal, …
export default {
  field1: value1,
  field2: value2
  • Example with the full syntax:
let myObject = {
  field1: value1,
  field2: value2
export {myObject as default};

import it as:

import whatEverNameIWant from ...


export const name = 'value';
export const MyComponent = /* ... */;
export const MyOtherComponent = /* ... */;

import it with

import { name, MyComponent, MyOtherComponent } from ...;

Discover More
CommonJs (Node.js) - Module.exports

If you want the commonJs/Node module to be an instance of some class, assign the desired export object to the module.exports property. Note that assigning the desired object to exports will simply rebind...
Javascript ES - Module Script (esm / .mjs)

The module implementation in Ecma Script (ES2015). An ES6 module is a Javascript file: automatically set in strict-mode with export statement and / or statement Everything inside a module is...
Javascript Module - Import (Es Module)

This page is the import statement defined in the es module specification The ES6 import is: a function for dynamic import (performed at runtime time) or a statement for static import (performed...
React - Lazy

The lazy function implements lazy loading. (ie it will let you defer loading component’s code until it is rendered/executed for the first time) It's part of code splitting meaning that the build step...

Share this page:
Follow us:
Task Runner