This content originally appeared on DEV Community 👩💻👨💻 and was authored by Yash Solanki
Introduction
If you’re a NodeJs developer, you might have come across some code snippets which use require() to import modules while others use import for the same purpose; which might have got you to wonder, which one of these is correct and which should you use in your project?
In this article, we’ll try to answer all such questions and clear the air around the difference between both the import techniques.
Scope
- This article will walk you through the difference between the two import techniques in NodeJS, or, in general, the difference between the two module systems which use these import techniques.
- This article does not cover the difference in syntax for default, named, and mixed exports in both the module systems.
Modules and Module systems
- Module systems enable us to structure and organize different modules in our Javascript code
- By default, Node uses CommonJS, while ES Modules is the Javascript official standard for writing reusable code on both client and server.
As we are already aware, each file in Node is treated as a separate module.
A module is a Javascript file containing related code. So as our application gets bigger, we can split it into different files viz. modules, which makes our code more readable and also allows us to reuse the code in different parts of our application
The code inside these modules is not available globally i.e. you cannot directly access the variables, functions, and classes defined in one module in any other module.
Instead, we have to explicitly tell NodeJS which parts of a module must be exported and which parts must be imported into a file. The module system helps us to structure and organize these modules.
In this article, we’ll try to understand two commonly used module systems - CommonJS and ECMAScript or ES Modules.
CommonJS vs ES Modules
requireis used to import modules in CommonJS whileimportis used in ES Modules.
Since require and import are just small parts of two different module systems, it makes more sense to differentiate between CommonJS and ES Modules to get a larger picture.
CommonJS (Uses require for importing modules)
-
CommonJSis the legacy module system implemented by NodeJS. In CommonJS, we can export modules usingmodule.exportsand import them usingrequire - We can import various built-in modules, third party modules (installed via npm), or any of our local modules using
require
//calculate.js
function add(num1, num2) {
return num1 + num2;
}
function subtract(num1, num2) {
return num1 - num2;
}
module.exports = {add, subtract};
//index.js
const { add, subtract } = require('./calculate');
console.log(add(1, 2)); // 3
console.log(subract(3, 2)); // 1
ES Modules (Uses import for importing modules)
- While Javascript did not have any built-in module system in the beginning, Node used CommonJS as its default module system
- But, in ES2015 (also commonly known as ES6), Javascript got its own module system - ES Modules, which has been widely adopted ever since, and NodeJs also added support for the same.
-
We can use ES Modules instead of the default CommonJS module system in Node by either
-
Changing the extension of the file from
.jsto.mjs-
So, in the example above, if we change the extension of the files to
.mjs, we can use the ES6 syntax for importing and exporting modules
//calculate.mjs function add(num1, num2) { return num1 + num2; } function subtract(num1, num2) { return num1 - num2; } export { add, subtract }; //index.mjs import { add, subtract } from './calculate.mjs'; console.log(add(1, 2)); // 3 console.log(subract(3, 2)); // 1
-
Or instead of changing the file extension, we can also add a property
"type": "module"at the top-level ofpackage.jsonto use ES Modules across our Node application
{ "name": "nodejs-app", "dependencies": { ... } "type": "module" } -
Difference between CommonJS and ES Modules
-
CommonJS modules can be imported at any place in the program while ES modules have to be imported only at the beginning of the program
const express = require('express'); function getData() { const data = require('./data'); //This is valid //Do Something } -
CommonJS modules can also be imported conditionally which is not the case for ES Modules
if(someCondition) { const data = require('./data.js'); //Do something } Since CommonJS modules are imported dynamically at runtime, module bundlers like webpack cannot remove unused modules from the production build, thus increasing the size of the bundle
CommonJs modules are loaded synchronously, which means that the modules are processed one by one, which can cause performance issues in large scale applications. ES Modules, on the other hand, are imported asynchronously, thus offering performance benefits as the application scales
Widely used CommonJs variables like
__dirname,__filenameandNODE_PATH********are not available in ES ModulesES Modules cannot be used to import JSON files as modules, while CommonJS supports this feature
ES Modules is the official standard and most of the frontend frameworks like React, Vue etc use it, so it offers consistency in client and server side code
Which one should you use?
- If you want consistency in the backend and frontend, you should consider using ES Modules as it is the official standard for Javascript.
- Node v9 or below versions do not support ES modules. Though it’s very unlikely, but if you’re working on a project with these node versions, you won’t be able to use ES Modules
- In conclusion, it doesn’t matter if you’re using CommonJS or ES Modules as long as you’re confident with the choice.
This content originally appeared on DEV Community 👩💻👨💻 and was authored by Yash Solanki
Yash Solanki | Sciencx (2022-10-07T14:51:43+00:00) require vs import in NodeJs. Retrieved from https://www.scien.cx/2022/10/07/require-vs-import-in-nodejs/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.