This article is about fixing error [ERR_REQUIRE_ESM]: require() of ES Module
  • 31-Jan-2023
Lightrun Team
Author Lightrun Team
This article is about fixing error [ERR_REQUIRE_ESM]: require() of ES Module

Error [ERR_REQUIRE_ESM]: require() of ES Module in Prismicio Slice Machine

Lightrun Team
Lightrun Team

Explanation of the problem

The issue is related to the dependencies slice-machine-ui and @nuxtjs/prismic, both version 0.3.3 and “alpha” respectively, in a project that uses npm or yarn. The problem occurs when running the command npm/yarn run slicemachine.

The error message encountered is related to the use of require in the file /node_modules/@slicemachine/core/build/src/utils/cliLogs.js. The library “ora” is imported using the __importDefault method from the “ora” package, however, the require of “ora/index.js” is not supported as it is an ES Module.

A proposed solution is to use the import statement instead of require in the file /node_modules/@slicemachine/core/build/src/utils/cliLogs.js. This will allow the module to be imported dynamically, which is available in all CommonJS modules.

Troubleshooting with the Lightrun Developer Observability Platform

Getting a sense of what’s actually happening inside a live application is a frustrating experience, one that relies mostly on querying and observing whatever logs were written during development.
Lightrun is a Developer Observability Platform, allowing developers to add telemetry to live applications in real-time, on-demand, and right from the IDE.

  • Instantly add logs to, set metrics in, and take snapshots of live applications
  • Insights delivered straight to your IDE or CLI
  • Works where you do: dev, QA, staging, CI/CD, and production

Start for free today

Problem solution for Error [ERR_REQUIRE_ESM]: require() of ES Module in Prismicio Slice Machine

The Error [ERR_REQUIRE_ESM]: require() of ES Module occurs when attempting to run the Slice Machine in an environment utilizing the dependencies slice-machine-ui version 0.3.3 and @nuxtjs/prismic with a version of “alpha”. The error occurs in the file /node_modules/@slicemachine/core/build/src/utils/cliLogs.js where the module ora is imported using the require method, which is not supported in this scenario.

To resolve this error, it is recommended to use the import statement instead of require in the file /node_modules/@slicemachine/core/build/src/utils/cliLogs.js. This will allow for dynamic imports, which are available in all CommonJS modules and will resolve the error.

It is important to note that a change to the import method may impact the compatibility of the code with other modules or dependencies in the project. Therefore, it is recommended to thoroughly test the solution before implementing it in a production environment.

Other popular problems with Prismicio Slice Machine

Problem: Error [ERR_REQUIRE_ESM]

One common issue faced by developers using Prismicio Slice Machine is the error [ERR_REQUIRE_ESM]. This error occurs when attempting to use the require() method for importing an ES6 module, specifically when the index.js file is imported from the /node_modules/ora/ directory in the /node_modules/@slicemachine/core/build/src/utils/cliLogs.js file. This error message indicates that require() is not supported for ES modules.


The solution to this problem is to use the import statement instead of require(). By changing the index.js import in the cliLogs.js file to a dynamic import(), which is available in all CommonJS modules, the error [ERR_REQUIRE_ESM] can be resolved.

Problem: Inconsistent module versions

Another common issue faced by developers using Prismicio Slice Machine is inconsistent module versions. This can occur when different dependencies are installed and used at different versions, leading to compatibility issues and unexpected behavior. This problem can be particularly prevalent in larger projects that make use of a large number of dependencies.


The solution to this problem is to ensure that all dependencies are at the same version. This can be done by specifying the required versions in the package.json file and using a package manager such as npm or yarn to manage and install the dependencies. This will ensure that all dependencies are consistent and compatible, reducing the risk of version-related issues.

Problem: Slow build times

A third common issue faced by developers using Prismicio Slice Machine is slow build times. This can be caused by a number of factors, such as the size and complexity of the project, the number of dependencies, and the performance of the development environment. Slow build times can reduce productivity and make it difficult to quickly iterate on a project.


The solution to this problem is to optimize the build process by reducing the number of dependencies, improving the performance of the development environment, and using performance-enhancing tools and techniques such as code splitting and tree shaking. Additionally, regularly profiling the build process can help identify and address performance bottlenecks.

A brief introduction to Prismicio Slice Machine

Prismic Slice Machine is a technical tool designed for front-end developers to extract and manage reusable content components, known as Slices, in the Prismic content management system. It enables developers to easily create, edit, and reuse complex content components in a visual and efficient manner, while ensuring that they are consistent with the design system of a website or application.

Slice Machine operates by converting content from the Prismic API into slices, which are reusable components that can be configured with custom styles, logic, and data. These slices are automatically generated based on the content model in Prismic, and can be used in any page or template, eliminating the need for manual code updates and reducing the time spent on content updates. This tool supports both traditional HTML and modern JavaScript frameworks, making it an essential tool for developers looking to streamline their content management processes and improve the performance of their websites and applications.

Most popular use cases for Prismicio Slice Machine


  1. Dynamic Content Management: Prismic Slice Machine can be utilized to manage dynamic content within web applications and websites. This allows developers to create reusable, modular components for website content, making it easier to maintain and update.
  2. Increased Development Efficiency: By utilizing slices, developers can streamline the development process and reduce the time required to complete projects. This is achieved by reducing the need to manually code content and allowing developers to focus on the functionality of the application.
  3. Improved User Experience: Slice Machine allows developers to create custom, visually appealing content modules that can be easily integrated into the website. This results in an improved user experience as the content is optimized for easy consumption and engagement.
  <slice type="text">
      <p>Welcome to my website</p>
  <slice type="image_and_text">
    <image url="image.jpg"/>
      <p>Learn about my latest project</p>

It’s Really not that Complicated.

You can actually understand what’s going on inside your live applications.

Try Lightrun’s Playground

Lets Talk!

Looking for more information about Lightrun and debugging?
We’d love to hear from you!
Drop us a line and we’ll get back to you shortly.

By submitting this form, I agree to Lightrun’s Privacy Policy and Terms of Use.