Digital Garden
Computer Science
JavaScript
Modules

Modules

Info

why use modules and how to use? maybe also mention webpack.

Exports and imports

In JavaScript projects you split your code across multiple JavaScript files, so called modules. You do this, to keep each file/module focused and manageable. To still access functionality in another file, you need export (to make it available) and import (to get access) statements. You got two different types of exports: default (unnamed) and named exports: Default => export default ...; Named => export const someData = ...; You can import default exports like this:

import someNameOfYourChoice from "./path/to/file.js";

Named exports have to be imported by their name:

import { someData } from "./path/to/file.js";

A file can only contain one default and an unlimited amount of named exports. You can also mix the one default with any amount of named exports in one and the same file. When importing named exports, you can also import all named exports at once with the following syntax:

import * as upToYou from "./path/to/file.js";

This simply bundles all exported variables/functions in one JavaScript object. You can access like this: upToYou.someData