Blog / Node JS

SyntaxError: Cannot use import statement outside a module

This error message is typically encountered when you try to use an import statement outside of a JavaScript module. JavaScript modules are special files that contain modular code, and they use the "import" and "export" keywords to control what parts of the code are visible and accessible from other modules.

To fix this error, you should ensure that your code is running in a JavaScript module context. There are several ways to do this:

Use require in place of import

//import { createClient } from '@supabase/supabase-js'
const { createClient } = require('@supabase/supabase-js')

Change type to a module

Add "type": "module" to your package.json file.

{
  // ...
  "type": "module",
}

Use the "type" attribute

<script type="module" src="your_script.js"></script>

It's also worth noting that some older browsers may not support JavaScript modules, so you may need to use a transpiler like Babel to convert your module code into a format that is compatible with older browsers.

Why did this happen?

Node.js now supports ES modules (also called ECMAScript modules) since version 12.0.0, which was released in April 2019. Before that, Node.js only worked with CommonJS modules.

In more informal terms, you can think of modules as small pieces of code that you can use and re-use in your JavaScript programs. They make it easier to organize your code into separate files or modules, which can help you keep your codebase more manageable.

CommonJS modules are the older way of working with modules in Node.js, and they have a different syntax for importing and exporting code than ES modules. CommonJS modules use the require() function to import code, and the module.exports object to export code.

ES modules are the newer and more modern way of working with modules in JavaScript, and they use the import and export keywords to import and export code, respectively. ES modules are part of the ECMAScript standard, which is the official specification for the JavaScript language.

In summary, if you're using a newer version of Node.js (version 12.0.0 or higher), you can use both CommonJS and ES modules. However, if you're using an older version of Node.js, you'll need to use CommonJS modules, as ES modules are not supported.