본문 바로가기
프론트엔드 빌드 환경

[nodemon+babel] babel 과 nodemon 개발 환경 구축하기

by devebucks 2021. 6. 12.
728x90

우아한테크러닝 프로젝트를 수행하면서  express로 서버 쪽을 개발하고 있습니다. 

저번 글에서 언급했지만, node가 ES6문법 중에 import 문법을 읽지 못하는 문제를 babel 패키지를 프로젝트 개발 환경에 설치해서 문제를 해결했습니다.

 

추가로, nodemon을 개발 환경에 추가하려고 합니다. nodemon을 추가하려는 이유는 개발 환경을 편하게 만들기 위해서입니다.  nodemon이 없다면, 하루에도 코드는 몇 번이고 변경이 되고 테스트를 위해서 개발자는 반복적으로 수십 번 서버 재실행을 하게 될 겁니다. 🤔

 

nodemon

nodemon은 node환경에서 개발 코드 변경을 감지해서 자동으로 서버를 재실행 해주는 패키지입니다.

기본적인 usage는 다음과 같습니다.

1. 설치

$ npm i -D nodemon

2. nodemon 실행

$ nodemon ./src/app.js

 

그런데, node환경에서 ES6 이상의 문법으로 개발하는 경우, babel로 트랜스파일하지 않고 nodemon으로 실행하면, 분명 오류가 발생합니다. 

$ nodemon ./src/app.js

SyntaxError: Unexpected identifier

 

nodemon + babel

그래서, nodemon을 실행할 때 우선적으로 babel로 트랜스파일링을 한 js파일을 실행하게 명령어를 실행해야 합니다.

$ nodemon --exec babel-node ./src/app.js 

babel-node는 뒤에 있는 js를 트랜스파일링 해줍니다.

--exec는 뒤에 타겟이 되는 js파일을 실행하는 옵션입니다.

 

이렇게 실행하면, 빌드가 되서 실제 결과물이 생성되진 않지만, 로컬 node 서버에서 babel로 트랜스파일된 js가 실행됩니다.

 

 

레벨 업

nodemon과 babel을 사용해서 개발환경을 더 편하게 만들 수 있게 되었습니다.

728x90

댓글