Commonjs module error - v0 by Vercel

What is this error?

The current file is a CommonJS module whose imports will produce 'require' calls; however, the referenced file is an ECMAScript module and cannot be imported with 'require'. Consider writing a dynamic 'import("@strapi/blocks-react-renderer")' call instead. To convert this file to an ECMAScript module, change its file extension to '.mts', or add the field "type": "module" to '/home/..../packages/ui/package.json'.

373d ago

This error occurs when you're trying to import an ECMAScript module (ESM) from a CommonJS module using require(). Node.js has specific rules about module interoperability 12.

The error is telling you that:

Your current file is a CommonJS module (which uses require())
You're trying to import @strapi/blocks-react-renderer which is an ESM module
This isn't allowed by default in Node.js before version 22 3

You have several options to fix this:

Option 1: Convert your file to ESM

// Add "type": "module" to your package.json
// OR rename your file to have a .mts extension

Option 2: Use dynamic import

// Replace require() with dynamic import
const renderer = await import('@strapi/blocks-react-renderer');

Option 3: Use the latest Node.js and TypeScript

If you're using Node.js 22+ and TypeScript 5.8+, you can enable ESM imports in CommonJS by setting your TypeScript configuration 3:

{
  "compilerOptions": {
    "module": "nodenext"
  }
}

The simplest solution is usually Option 2 (dynamic import) if you need to keep your file as CommonJS, or Option 1 if you're willing to convert to ESM.

Sources

www.typescriptlang.org

TypeScript: Documentation - Modules - Reference

www.typescriptlang.org

TypeScript: Documentation - TypeScript 4.7

www.typescriptlang.org

TypeScript: Documentation - TypeScript 5.8

373d ago

What is this error?

373d ago

This error occurs when you're trying to import an ECMAScript module (ESM) from a CommonJS module using require(). Node.js has specific rules about module interoperability 12.

The error is telling you that:

Your current file is a CommonJS module (which uses require())
You're trying to import @strapi/blocks-react-renderer which is an ESM module
This isn't allowed by default in Node.js before version 22 3

You have several options to fix this:

Option 1: Convert your file to ESM

// Add "type": "module" to your package.json
// OR rename your file to have a .mts extension

Option 2: Use dynamic import

// Replace require() with dynamic import
const renderer = await import('@strapi/blocks-react-renderer');

Option 3: Use the latest Node.js and TypeScript

If you're using Node.js 22+ and TypeScript 5.8+, you can enable ESM imports in CommonJS by setting your TypeScript configuration 3:

{
  "compilerOptions": {
    "module": "nodenext"
  }
}

The simplest solution is usually Option 2 (dynamic import) if you need to keep your file as CommonJS, or Option 1 if you're willing to convert to ESM.