Why should you care?

Keeps projects organized — no giant global script tags.

See it live — copy this example

Paste into an HTML file or the browser console (F12). Use Run below when the live editor is available.

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

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

Run Example »

Edit the code below and click Run to see the result in Toolliyo’s live editor.

What happened?

• export exposes names; import pulls them in.
• Use type="module" on script tags in HTML.

Practice next

1. Create math.js export and main.js import.
2. Serve with vite or live-server, not file://.
3. Try export default vs named export.
4. Dynamic import("./heavy.js") when user opens analytics tab.
5. Re-export utilities from a barrel index.js file.

Remember

export / import type="module" One default export per file optional

ScriptVerse monorepo packages

Shared @scriptverse/utils module exports formatters imported across dashboard and admin apps.

Outcome: ES modules enforce explicit dependencies and enable tree-shaking in production builds.