[JavaScript] Webpack - Module 기본

Webpack

Module 이란?

프로그램을 구성하는 내부의 코드가 기능별로 나뉘어져 있는 형태
(한 파일에 씌여진 큰 코드 덩이를 여러개의 파일로 나뉘어서 사용할 수 있습니다)

모듈A = 함수A, 함수B
모듈B = 함수A

Module의 표준

Module을 사용하기 위해서는 Module을 인식하는 Module System과 Module을 다루는 키워드가 제공되어야 합니다.

1. CommonJS (Node.js)
2. ESM (ECMAScript ~)

Module을 다루는 키워드

모듈A = 함수A, 함수B
1. 내보내기
2. 가져오기

Module 내보내는 방법

1. 한 곳으로 내보내기
2. 개별적으로 내보내기

Module 가져오는 방법

모듈 객체를 참조하는 형태 -> {함수A} {...}

Module Keyword : 가져오기

Common JS에서 모듈 가져오는 방법
require라는 키워드를 사용하여 모듈을 가져옵니다.

require(모듈의 경로)

Common JS에서 모듈을 내보내는 방법
common js에서는 전역으로 접근할 수 있는 module이 제공됩니다.

module.exports = {...}
module.exports = 값
module.exports.키_이름 = 값
exports.키_이름 = 값