본문 바로가기

Web Development/Back-end

Express - Babel(바벨) 적용하기

Express 에서 바벨 사용법 요약.

 

바벨을 사용하는 이유는?

- 최신 JS 문법을 사용하기 위함(ES6이후 문법)이며, 구형 브라우저에서 동작할 수 있도록 코드를 변환해주는 변환 역할을 한다.

 

코드에서 차이점은?

//express를 불러오는 방법 (구식)
const express = require('express');


//Express를 불러오는 신식 방법
import express from "express";

 

 

 

그럼 Express에서 바벨을 적용시키는 방법은?

 

Babel 적용 방법

 

1. 터미널 창에 다음과 같이 코드를 입력해서 다운로드한다.

npm install @babel/core @babel/node @babel/preset-env --save

 

2. .babelrc 파일을 만들고 다음의 코드를 삽입한다.

{

  "presets":["@babel/preset-env"]

}

 

3. Package.json 파일에 다음 코드를 추가.

"scripts": {
    "start": "nodemon app.js --exec babel-node",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

 

 

 

**부가설명

 

0. Nodemon은 기본적으로 설치되어 있어야한다.

 

1. babel/preset-env : 언어 변환역할을 수행하는 패키지

 

2. babel/core : 이름그대로, 바벨의 핵심 모듈.

 

3. babel/node : babel-cli가 터미널 환경에서 cli로 작업할 수 있게 해줬는데, 그것과 동일한 역할을 함. Node용으로 분리되었음.