Errors / JavaScript errors

Uncaught SyntaxError: Cannot use import statement outside a module

A modern script was loaded the old way, so the browser refused to read it.

The whole file is skipped.

Why it happens

• A file using import loaded with <script src> instead of <script type="module" src>.
• A library's ESM build linked directly where its browser (UMD) build was meant.

How to fix it

1. Add type="module" to the script tag (it then runs deferred, and in its own scope).
2. Or bundle the code so the browser gets one plain script.
3. Or use the library's UMD build, which does not use import.
4. To confirm, open the file named on the console line in DevTools' Sources panel: an import on its first lines, loaded by a tag with no type, is this error. The same code under a bundler's dev server works, which is why it often appears only after a hand-made deploy or a copied snippet.

Whose problem it is

Usually the site's own code or settings.

Often seen with

• require is not definedA file written for a server's module system was sent to the browser as it is.