🔧 ES Modules in Node.js: The Modern Way to Handle Modules 🚀
Nachrichtenbereich: 🔧 Programmierung
🔗 Quelle: dev.to
Hey awesome devs! 👋 Have you ever wondered about ES Modules (ESM) in Node.js and how they differ from CommonJS (require
and module.exports
)?
Well, you’re in the right place! Today, we’re diving into ES Modules, the modern way to import and export in JavaScript. By the end of this post, you’ll understand ES Modules like a pro! 😎
🧐 What Are ES Modules (ESM)?
ES Modules (ECMAScript Modules) are the standard JavaScript module system that allows you to import and export code cleanly and efficiently. Unlike CommonJS, which is synchronous, ESM supports asynchronous loading, making it great for modern applications.
🔹 Why Use ES Modules?
✅ Better performance (supports async imports).
✅ Tree-shaking (removes unused code to reduce file size).
✅ More readable syntax (import/export
instead of require
).
✅ Standardized across browsers & Node.js.
🔥 How to Use ES Modules in Node.js
1️⃣ Enable ES Modules in Node.js
To use ES Modules in Node.js, you have two options:
🔹 Option 1: Use .mjs
extension
node myfile.mjs
🔹 Option 2: Set "type": "module"
in package.json
{
"type": "module"
}
Now, all .js
files in your project will be treated as ES Modules.
📥 Importing in ES Modules
Instead of require()
, ES Modules use import
:
// Importing a named export
import { greet } from './utils.js';
greet('Alice'); // Output: Hello, Alice!
📤 Exporting in ES Modules
There are two ways to export in ESM:
1️⃣ Named Exports
Export multiple functions or variables:
// file: utils.js
export function greet(name) {
return `Hello, ${name}!`;
}
export const age = 25;
Importing:
// file: app.js
import { greet, age } from './utils.js';
console.log(greet('Bob')); // Output: Hello, Bob!
console.log(age); // Output: 25
2️⃣ Default Export
Export a single value:
// file: math.js
export default function add(a, b) {
return a + b;
}
Importing:
// file: app.js
import add from './math.js';
console.log(add(5, 3)); // Output: 8
🚀 Default exports don’t need curly braces ({}
) when importing!
⚠️ Common Mistakes to Avoid
❌ Mixing CommonJS and ES Modules
const myModule = require('./utils.js'); // ❌ Won’t work with ESM!
✅ Use import
instead:
import myModule from './utils.js';
❌ Forgetting .js
extension in imports
import { greet } from './utils'; // ❌ Error in Node.js!
✅ Always include .js
:
import { greet } from './utils.js';
🚀 When to Use ES Modules vs CommonJS?
Feature | CommonJS (require ) |
ES Modules (import/export ) |
---|---|---|
Default in Node.js | ✅ Yes | ❌ No (requires setup) |
Browser Support | ❌ No | ✅ Yes |
Asynchronous Loading | ❌ No | ✅ Yes |
Tree-Shaking Support | ❌ No | ✅ Yes |
If you’re building modern applications or want better performance, ES Modules is the way to go! 🚀
🎯 Final Thoughts
ES Modules are the future of JavaScript! They are cleaner, faster, and standardized across both browsers and Node.js. Start using them today to write modern, efficient code! 💪
This is just the beginning! In the next article, we’ll explore Importing JSON and Watch Mode—stay tuned! 🎯
If you found this blog helpful, make sure to follow me on GitHub 👉 github.com/sovannaro and drop a ⭐. Your support keeps me motivated to create more awesome content! 🚀
Happy coding! 💻🔥
...
🔧 Có thể bạn chưa biết (Phần 1)
📈 28.58 Punkte
🔧 Programmierung
🔧 Grok 3: AI Thông Minh Nhất Thế Giới
📈 28.58 Punkte
🔧 Programmierung
🔧 Best way to handle forms in Remix.run
📈 18.1 Punkte
🔧 Programmierung
🔧 What’s Pythonic way to handle exceptions?
📈 18.1 Punkte
🔧 Programmierung