JavaScript Module Scripts

Written by Swapnil RajaUpdated 28 Aug 2026

A script becomes a module by adding type="module" to its tag.

Without it, import and export are syntax errors.

The attribute also changes a few things about how the script loads.

Example

javascript

// Demonstrating the behaviour a module script gives you,
// without needing a real module file.
console.log("this simulates a deferred module script");

A module script behaves like a normal deferred script, described below.

What type="module" Changes

It enables import and export.

The script is deferred automatically, without needing the defer attribute.

It always runs in strict mode.

PreviousJavaScript import NextJavaScript Dynamic Import

Example

javascript

let loadCount = 0;

function simulateModuleLoad() {
  loadCount++;
  return "module content";
}

const first = simulateModuleLoad();
const second = first;

console.log(loadCount);

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>Module Scripts</title>
</head>
<body>

  <h1>Loaded as a module</h1>
  <p id="out"></p>

  <script type="module">
    document.getElementById("out").textContent = "Module script ran";
  </script>

</body>
</html>

JavaScript Module Scripts

Example

What type="module" Changes

Syntax

Automatically Deferred

Example

Runs Once, However Many Times It Is Included

Example

CORS for Cross-Origin Modules

Example

No Module Scripts from file://

Example

nomodule for Old Browsers

Example

Complete Example

Try It Yourself

Important Points

Conclusion