Short answer
In the browser, load the file with script type="module". In Node.js, make the file an ES module: .mjs, or "type": "module" in package.json (or switch the file to module.exports if the project is CommonJS). In Jest, the file is usually a package in node_modules that ships only ES modules, which Jest does not transform by default: add it to transformIgnorePatterns as an exception, or use Jest’s ES module support. In Next.js, list the package in transpilePackages.
Where the file was loaded, and the fix
01
In the browser: a classic script tag
“If this module is referenced from a <script> tag, you can use the type="module" attribute.” MDN, JavaScript modules
A script tag without type="module" runs the file as a classic script. Mark it as a module, and import its dependencies with paths the browser can load.
<script type="module" src="/js/app.js"></script>02
In Node.js: the file runs as CommonJS
“Files with a .js extension when the nearest parent package.json file contains a top-level "type" field with a value of "module".” Node.js, Packages: determining module system
Node.js treats .cjs files, and .js files under "type": "commonjs", as CommonJS. Node.js 22.7 and 20.19 and newer detect ES module syntax in files with no marker, so the error mostly appears in explicit CommonJS and in older versions. Pick one module system per file: rename to .mjs, set "type": "module", or convert export to module.exports.
// package.json { "type": "module" }03
In Jest: an ES module package in node_modules
“If the file path matches any of the patterns, it will not be transformed.” Jest, Configuration: transformIgnorePatterns
Jest transforms your code but skips node_modules by default, so a dependency that ships only ES modules reaches Node.js untransformed. Let Jest transform that package by excluding it from the ignore pattern. This assumes the default babel-jest transform; with next/jest, which sets its own ignore patterns, override transformIgnorePatterns on the config it returns.
// jest.config.js module.exports = { transformIgnorePatterns: ['/node_modules/(?!(nanoid|uuid)/)'], };04
In Next.js or another bundler
A package that ships untranspiled ES module syntax can hit the same error. In Next.js, add the package to transpilePackages; in other bundlers, include it in the transpile step.
// next.config.mjs export default { transpilePackages: ['some-esm-package'] };
Checked against the vendor’s docs on : MDN: JavaScript modules; Node.js: Packages (module system); Jest: Configuration (transformIgnorePatterns).
Rather hand it over?
Fixed scope, fixed price, paid upfront. The work happens in writing; no call needed.
- from $450App Fix TicketOne reproducible bug in an existing mobile or web app, diagnosed and fixed.See scope and start
- from $450AI-Built App RescueA Lovable, Bolt or Cursor app checked end to end in 3 days, then its worst problems fixed at a fixed price.No issues worth fixing, no charge. If the Launch Check finds nothing rated medium or higher, Simon refunds the full $450. You keep the report either way. This applies to the first 10 Launch Checks bought after October 30, 2026.See scope and start
Related: Node.js “Cannot use import statement outside a module” · Node.js ERR_REQUIRE_ESM · “SyntaxError: Unexpected identifier”