Export and Import

Export and Import

export shares code from a module; import brings it in elsewhere.

Named exports

// math.js
export const pi = 3.14;
export function add(a, b) {
  return a + b;
}

Importing named exports

// main.js
import { pi, add } from "./math.js";
console.log(add(2, 3)); // 5

Default exports

A module can have one default export:

// greet.js
export default function greet() {
  console.log("Hello");
}

Importing a default

import greet from "./greet.js";
greet();

Default imports do not use curly braces.

Named vs default

• Named exports: import { name } from a module.
• Default export: import name (no braces), one per module.

Renaming imports

import { add as sum } from "./math.js";
sum(2, 3); // 5

TL;DR

• export shares values, import brings them in.
• Named: export const x; import { x }.
• Default: export default x; import x.
• Use the as keyword to rename.