require와 import의 차이점

Leo·2023년 7월 26일
0

FrontEnd

목록 보기
16/26
post-thumbnail

require / import
require 와 imports 는 모듈 키워드로 외부 파일이나 라이브러리를 불러올 때 사용합니다.
require는 NodeJS에서 사용되고 있는 CommonJS의 키워드이고, import는 ES2015에서 새롭게 도입된 키워드입니다.

import

JS의 ES6 문법으로 다른 패키지 안에 있는 클래스, 메소드, 변수 등의 데이터를 사용하고자 할 때 쓰는 키워드입니다.
import를 사용해 모듈을 가져온 뒤 만든 객체를 내보내기 위해서는 export를 사용하는데 require와는 약간 다릅니다.

단일 객체 내보내기

export default = variable

복수 객체 내보내기

export variable

require

CommonJS에서 사용하는 모듈을 불러오는 키워드입니다.

단일 객체 내보내기

module.exports = variable

복수 객체 내보내기

export.variable = variable

정리

두 키워드 모두 동일한 목적을 가지고 있지만 다른 문법 구조를 가지고 있다는 것을 알 수 있었으며, Babel과 같은 ES6 코드를 변환해 주는 도구 없이는 import 키워드를 사용할 수 없어 require 키워드를 사용해야 합니다.

예시로 번들링을 위해 사용하는 webpack은 node.js 환경에서 구동하므로 require을 사용해야 합니다. 하지만 리액트 라이브러리를 사용할 때는 import 구문이 사용이 가능합니다. 그 이유는 babel에서 import 구문을 require 구문으로 변환해 주기 때문입니다.

0개의 댓글