Node version mismatch – Cannot use import statement outside a module

The error “Cannot use import statement outside a module” typically occurs when you are using ES modules (import/export) syntax in a Node.js environment that does not support it. This error is often due to a mismatch between the version of Node.js you’re using or the configuration of your project.

Steps to Resolve “Cannot use import statement outside a module” Error:

1. Ensure You’re Using a Node Version That Supports ES Modules (Node 12 or Later)

Node.js officially added support for ES modules (import/export) starting from Node 12, with better support in Node 14 and later. If you are using a version of Node lower than 12, you need to upgrade to a newer version that supports ES modules.

To check your Node version:

node -v

If you’re using an older version of Node, update it to the latest LTS version:

nvm install --lts  # If you're using Node Version Manager (NVM)

Or manually update via the Node.js website.

2. Add "type": "module" to package.json

If you’re using ES modules in your Node.js project, you need to tell Node that you’re working with modules. You can do this by adding "type": "module" to your package.json.

{
  "type": "module"
}

This allows you to use import/export syntax in your .js files. Without this, Node will treat .js files as CommonJS, which doesn’t support import/export syntax.

3. Use .mjs Extension for ES Modules

If you don’t want to set "type": "module" in your package.json, you can use the .mjs file extension for files that use the ES module syntax.

For example:

// In a file named example.mjs
import fs from 'fs';

This will tell Node.js to treat the file as an ES module, even without the "type": "module" configuration in package.json.

4. Update Dependencies and Tools

Make sure that the tools you’re using (such as Babel, Webpack, TypeScript, etc.) are properly configured to handle ES modules.

For Babel:

If you’re using Babel to transpile your code, make sure that Babel is set up to work with ES modules. You may need to install and configure the following Babel plugins:

npm install --save-dev @babel/preset-env

In your .babelrc or Babel configuration file:

{
  "presets": ["@babel/preset-env"]
}

For Webpack:

If you’re using Webpack, make sure you have the appropriate configuration for handling ES module syntax.

module.exports = {
  resolve: {
    extensions: ['.js', '.mjs'],
  },
  module: {
    rules: [
      {
        test: /\.m?js$/,
        type: 'javascript/auto', // Enables ES module support
      },
    ],
  },
};

For TypeScript:

If you’re using TypeScript, make sure your tsconfig.json file is set to output ES modules:

{
  "compilerOptions": {
    "module": "ESNext",
    "target": "ESNext"
  }
}

5. Use CommonJS Syntax (As a Temporary Workaround)

If you cannot upgrade to a version that supports ES modules or change your project’s configuration, you can temporarily use CommonJS syntax (e.g., require() and module.exports) instead of import/export.

// Replace ES modules syntax
import express from 'express';

// With CommonJS syntax
const express = require('express');

6. Check for Misconfigured or Outdated Bundler/Toolchain

If you’re using a bundler like Webpack or a toolchain like Parcel, make sure they are configured to handle ES modules properly. Sometimes, an incorrect or outdated configuration can cause issues with ES module support.

7. Restart the Project

After making changes, restart your Node.js server or development environment to apply the changes.

npm start