How to write ESM import for old common js packages in Node JS projects

Hari Anitha

• 2 min read

SM (ECMAScript Modules) is a newer module system introduced in Node.js version 12. It provides a standardized way of loading and exporting modules in JavaScript applications, which is similar to the module systems used in modern web browsers. The traditional require function, on the other hand, is part of Node.js' CommonJS module system and has been used in Node.js for a long time. Here are some advantages and disadvantages of using ESM modules over require:

Advantages of using ESM modules:

  1. Better compatibility with modern JavaScript: ESM is a standardized way of loading and exporting modules in JavaScript applications, and it's designed to work with modern JavaScript features like import and export. This makes it easier to write modular code that is compatible with both Node.js and modern web browsers.
  2. Improved performance: ESM modules are statically analyzed at compile time, which can lead to faster startup times and better performance compared to CommonJS modules.
  3. Better support for tree shaking: ESM modules have a more explicit syntax for imports and exports, which makes it easier for tools like webpack to perform tree shaking and eliminate dead code.
  4. Better support for dynamic imports: ESM modules have built-in support for dynamic imports, which allows you to load modules asynchronously at runtime. This can be useful for code splitting and other advanced use cases.

Disadvantages of using ESM modules:

  1. Limited backward compatibility: ESM is a newer module system, and it may not be fully supported by all versions of Node.js and third-party libraries. This can make it more difficult to migrate existing projects to ESM modules.
  2. Different syntax: ESM modules use a different syntax than CommonJS modules, which means you'll need to learn a new way of importing and exporting modules.
  3. No circular dependencies: Unlike CommonJS, ESM does not support circular dependencies, which can make it more difficult to write certain types of code.
  4. No dynamic require: ESM modules don't support the require function, which can make it more difficult to use certain third-party libraries that rely on it.

Overall, ESM modules offer several advantages over CommonJS modules, especially in terms of compatibility with modern JavaScript and improved performance. However, there are also some disadvantages to consider, such as limited backward compatibility, different syntax, and lack of support for circular dependencies and dynamic require.

How to import Common JS package using imports

When working with an old CommonJS package in a JavaScript project that is using ESM modules, you can still import the package using the following steps:

  • Install the esm package as a development dependency by running the following command:
npm install --save-dev esm
  • Create an entry file for your project (for example, index.js) and add the following code at the top:
require = require('esm')(module);
module.exports = require('./app.js');

In this code, we are using the esm package to modify the behavior of the require function so that it can load ESM modules.

  • In your app.js file, you can then use the import statement to import the CommonJS module as an ESM module:
import someModule from 'some-module';

Here, we are importing the some-module package as an ESM module using the import statement, even though it is a CommonJS module.

  • Finally, you can run your project using the node command with the -r flag to enable ESM support:
node -r esm index.js

This command will run your project with the ESM module loader enabled, which will allow you to use the import statement to load CommonJS modules as ESM modules.

By following these steps, you can use ESM modules to import old CommonJS packages in your JavaScript projects. However, it's worth noting that some CommonJS modules may not work properly with the ESM module loader, so you may need to test and modify your code accordingly.