Soony's House

[Node.js] Node.js 모듈시스템 / Common JS(CJS) & ES Module(ESM) 본문

✶Backend/NODE.JS

[Node.js] Node.js 모듈시스템 / Common JS(CJS) & ES Module(ESM)

soonybutter 2025. 4. 30. 18:23
728x90

 

목차

1. Node.js와 npm

2. Common JS (CJS) 와 ES module (ESM)


 

 

1. Node.js 와  npm  

 

💡 Node.js 란?

 

: 자바스크립트의 런타임 환경

브라우저의 밖(서버, 로컬 컴퓨터 등)에서도 자바스크립트를 실행할 수 있게 해주는 플랫폼이다. 

  ex) app.js라는 파일을 node app.js로 실행하면 Node.js가 그 JS파일을 실행해준다.

 

 

 

 

 💡Node.js를 웹개발에서 쓰는 이유

 

🔹 백엔드 개발

  • Express.js 같은 프레임워크를 통해 REST API 서버를 빠르게 구축할 수 있다.
  • 비동기 처리에 강해, 많은 요청을 효율적으로 처리한다.
  • 실시간 기능 (ex. 채팅, 알림) 구현에 최적!

🔹 프론트엔드 개발 환경 구축

  • npm (Node Package Manager)으로 다양한 라이브러리를 활용하여 코드 구현이 유용하다! 

https://www.npmjs.com/

 

npm | Home

Bring the best of open source to you, your team, and your company Relied upon by more than 17 million developers worldwide, npm is committed to making JavaScript development elegant, productive, and safe. The free npm Registry has become the center of Java

www.npmjs.com

 

  • Webpack, Vite, Babel 같은 빌드 도구가 Node.js 환경에서 동작한다.
  • React, Vue, Svelte 등 프레임워크의 개발 서버도 Node.js로 실행된다.

🔹 풀스택 개발

  • 결론적으로는 JavaScript만으로 프론트와 백 모두 개발이 가능해진다.
  • ex) React + Node.js + Express + MongoDB (=MERN 스택)

 


💡 npm 이란?

 

npm (Node Package Manager),

Node.js의 기본 패키지 관리자이며 Node.js를 설치하면 npm도 같이 설치된다.

또한 npm을 사용하면 다른 사람이 만든 라이브러리나 패키지를 설치하고 관리할 수 있다.

 

즉, Node.js는 엔진, npm은 그 Node.js 환경을 더 쉽게 활용하게 해주는 도구다.

함께 움직이는 관계이며, npm없이는 Node.js를 효율적으로 쓸 수 없음!!

 

 

 


 

 

 

2.  Node.js의 모듈시스템  -  CommonJS vs. ES Module

 

Node.js에서 모듈 시스템을 이해하는 것은 코드 재사용성과 유지보수성을 높이는 데 매우 중요하다.

 

모듈 시스템이란,

코드를 여러 파일로 나누어 관리하고, 각 파일 간에 기능(함수, 변수 등)을 주고받을 수 있게 해주는 구조이다.

JavaScript는 원래 브라우저에서 작동하던 언어이기 때문에 파일 간 코드 분리가 없었지만,

Node.js는 백엔드에서도 JS를 사용하게 되면서 파일 단위의 코드 분리와 재사용이 필요해졌고, 이를 위해 모듈 시스템이 도입되었다.

 

 

 

 

💡정보

  • 하나의 .js 파일은 하나의 모듈이 된다.
  • 다른 파일(모듈)에서 해당 모듈의 기능을 사용하려면 내보내기(export)불러오기(import) 를 사용해야 한다.
  • Node.js는 이를 위해 두 가지 방식의 모듈 시스템을 지원한다.

 

 

 

Node.js에서 사용하는 모듈 시스템; ConmonJS(CJS) 와 ES Module(ESM)

  1. CommonJS (CJS)
    • 전통적인 방식
    • require()로 모듈을 불러오고, module.exports로 내보낸다.
    • 모든 모듈이 동기적으로 로딩된다;
  2. ES Module (ESM)
    • ES6(ECMAScript 2015)부터 추가된 표준 모듈 시스템, 최근 널리 사용되는 중! 
    • import / export 문법을 사용하며, package.json에서는 "type": "module" 설정이 필요하다.
    • 정적 분석이 가능하고 비동기적으로 로딩될 수 있다.
    • 코드 분석 시점에 의존성을 파악할 수 있다.

 

 


Node.js는 기본적으로 CommonJS라는 모듈 시스템을 사용해왔지만,

최근에는 ES Module(ESM)가 점차 널리 사용되고 있다.

 

 

 
💡정리
  CommonJS (CJS) ES Module (ESM)
불러오기 require() import
내보내기 module.exports 또는 exports export, export default
처리 방식 런타임 로딩 (동기) 정적 분석 (비동기 가능)
확장자 .js .js, .mjs
지원 방식 Node.js 기본 package.json에서 "type": "module" 필요

 

 


 

 

2-1.  ES Module 방식으로 작성한 코드

package.json

{
  "name": "section03",
  "version": "1.0.0",
  "main": "chapter01.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start":"node src/index.js" 
  },
  "author": "",
  "license": "ISC",
  "description": "",
  "type": "module"  // type: module 추가 ! 
}

package.json 내의 "type"의 값에 "module"을 설정해준다.

 

 

 

math.js

function add(a, b) {
    return a + b;
}

function sub(a, b) {
    return a - b;
}

// 각 함수 앞에 export 키워드 붙이기만 해줘도 됨
export function add(a,b){
    return a + b;
}

export function sub(a,b){
    return a - b;
}


export { add, sub };

// export default: 하나의 모듈을 대표하는 default 값;
// import 할때 새로운 import 문을 만들어서 중괄호 없이 불러와야함.
export default function mul(a, b) {
    return a * b;
}

위와 같이 add와 sub은 이름으로 export하고, multiply는 default export 하였다.

 

 

index.js

// 동일한 경로인 경우, 합쳐서 import 가능
import mul, { add, sub } from "./math.js";

// deault export 불러오기
import mul from "./math.js";


console.log(add(1, 2));      // 3
console.log(sub(1, 2));      // -1
console.log(mul(3, 4)); // 12

 

import 문법을 통해 export된 함수들을 가져와 사용할 수 있다.
default export는 이름 없이 바로 가져오고, 나머지는 {}로 구조 분해하여 가져온다.

 

 

그럼 위의 코드를 CommonJs로 바꿔보자.

 

 

 

 

 

2-2.  CommonJS 방식으로 작성한 코드

 

math.js

function add(a, b) {
    return a + b;
}

function sub(a, b) {
    return a - b;
}

// add와 sub라는 변수 이름을 그대로 키 이름으로 쓸 때!
module.exports = {
    add,
    sub
};


// 속성이름을 다르게 설정할 때!
module.exports ={
	add: add,
    sub: sub
};

 

index.js

const moduleData = require("./math");
console.log(moduleData);
console.log(moduleData.add(1,2));
console.log(moduleData.sub(6,2));


//객체 구조분해 할당 방식
const {add, sub} = require("./math");
console.log(add(1,4));
console.log(sub(7,2));

module.exports를 통해 여러 함수를 객체 형태로 내보내고, require로 불러온다.

 

 

 

 

Node.js에서는 아직도 CommonJS 방식이 널리 쓰이고 있지만, ES Module의 도입이 증가하고 있다.
특히 프론트엔드와 함께 개발할 경우 ES Module을 사용하는 것이 일관성 있는 개발에 도움이 된다고 한다. 

 

 

 

 

 


 

 

 

 

설명이 부족하거나, 틀린 부분이 있다면 댓글 남겨주시면 감사하겠습니다☺️

728x90

'✶Backend > NODE.JS' 카테고리의 다른 글

[Node.js] Node.js 초기 설정, 환경변수 설정하기  (2) 2025.05.28