JavaSctipt

[Javascript] ES Modules 방식

판교너굴맨 2021. 6. 27. 00:07

node.js 보다 react를 먼저 접했던 나는 Commonjs 방식 보다 ES Modules 방식이 더욱 익숙했다.

그래서 node.js도 ES Modules 방식으로 사용하기 위해 찾아본 내용을 간단하게 정리해보려고 한다.

 

Commonjs 방식 : require / exports

app.ts

const test = require(./test)

test.ts

// 여러개 내보내기
exports.method = function () { ... }
exports.method = function () { ... }

// 한 개만 내보내기
module.exports.method = function () { ... }

 

ES Modules 방식 : import / export

app.ts

import test from '/test'

test.ts

// 여러개 내보내기
export function () { ... }
export function () { ... }

// 한 개만 내보내기
export default function () { ... }

 

nodeJs 에서는 CommonJs 방식을 채택했기 때문에 아무 설정 없이 ES Modules 방식을 사용하면 아래와 같은 에러가 나타난다.

위의 에러를 해결하기 위해서는 package.json 에서 아래와 같이 작성해주면 된다.

{
	...
	"type": "module"
	...
}

21/07/12 추가 내용

Typescript를 적용시 "type" : "module" 을 추가하지 않아도 ES Modules 방식으로 사용 가능하다 오히려 위의 코드를 추가하면 에러가 발생한다.

 

ES6 모듈의 이점

  • import , from, export, default 처럼 전용 키워드를 사용하기 때문에 가독성이 좋다.
  • 모듈에서 실제로 쓰이는 부분만 불러오기 때문에 성능과 메모리 부분에서 유리함.
  • es6의 Destructuring 문법을 사용해서 필요한 객체만 석택적으로 사용이 가능
  • typescript + node를 사용할 때 import 를 하면 type이 할당 되지만 require을 사용하면 any 타입이 할당된다.