Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SyntaxError: Cannot use import statement outside a module (from dependency)

How do you resolve "Cannot use import statement outside a module" from a dependency when the dependency isn't declared as a module?


I want to use the validator in Svelte/kit to validate emails. However, when importing the ESM version, I get the "Cannot use import statement outside a module" error. I'm using pnpm instead of npm or yarn.

import isEmail from 'validator/es/lib/isEmail'
/node_modules/.pnpm/[email protected]/node_modules/validator/es/lib/isEmail.js:1
import assertString from './util/assertString';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:355:18)
    at wrapSafe (node:internal/modules/cjs/loader:1039:15)
    at Module._compile (node:internal/modules/cjs/loader:1073:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at nodeRequire 

It appears that validator is attempting to use the import statement, but it's package.json does not specify "type": "module". My guess is that this is the root cause of the error.

Debug steps

  • package.json has "type": "module"
  • Upgraded to latest version of node
  • Tried using the non-esm version of validator 'validator/lib/isEmail', but that causes other errors not related to this thread.

Related

  • SyntaxError: Cannot use import statement outside a module — this solution is for code you control, not for dependencies
  • "Uncaught SyntaxError: Cannot use import statement outside a module" when importing ECMAScript 6 — this seems to be very similar, but I'm getting this error in node, not in the browser

Metadata

  • Node: v16.2.0
  • Sveltekit: v1.0.0-next.115
  • Validator: 13.6.0
like image 873
Nick Avatar asked Jun 18 '21 18:06

Nick


1 Answers

Have you tried importing like this?

import validator from 'validator'

I tried reproducing your issue with latest SvelteKit. This works fine:

// index.svelte
<script>
    import validator from 'validator';
    let result = validator.isEmail('[email protected]');
    console.log(result);
</script>

When I changed the import statement to:

import validator from 'validator/es/lib/isEmail'

I got the error from your question (Cannot use import statement outside a module).

Importing validator/es/lib/isEmail supposedly only imports a subset of the library. I'm not sure how much difference it will make; it might not make any difference. A slightly larger build beats a build that doesn't work. I suggest getting it working first, then optimize the build size if you really need to.

like image 141
Leftium Avatar answered Oct 14 '22 18:10

Leftium